Maison >interface Web >tutoriel CSS >Pourquoi la propriété css:list-style-type ne fonctionne-t-elle souvent pas ?

Pourquoi la propriété css:list-style-type ne fonctionne-t-elle souvent pas ?

黄舟
黄舟original
2017-06-29 13:47:283338parcourir

Si vous définissez list-style-type:disc sous IE6, un point plein devrait apparaître, mais il n'apparaît pas, comme indiqué dans le code suivant :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>处理IE的列表BGU</title>
</head>
<style type="text/css">
ul{list-style:disc outside;width:350px;height:auto;}
ul li{width:350px;line-height:30px;}
</style>
</head>
<body>
<ul>
<li>酷站代码1</li>
<li>酷站代码2</li>
<li>酷站代码3</li>
<li>酷站代码4</li>
<li>酷站代码5</li>
</ul>
</body>
</html>

Raison : Causé par l'application de l'attribut list-style-position: outside;

Le flottement à gauche entraînera la répétition du modèle de boîtehorizontalement un par un

La position du symbole de liste est à l'extérieur du modèle de boîte

donc le deuxième élément de la liste Le symbole est couvert par le premier élément de la liste

De plus, l'application de l'attribut float:left rendra également l'élément LI anormal.

Solution : modifiez list-style-position:outside ; list-style-position : inside ou supprimez le paramètre flottant.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn