>  기사  >  웹 프론트엔드  >  css:list-style-type 속성이 종종 작동하지 않는 이유는 무엇입니까?

css:list-style-type 속성이 종종 작동하지 않는 이유는 무엇입니까?

黄舟
黄舟원래의
2017-06-29 13:47:283302검색

IE6에서 list-style-type:disc를 설정하면 다음 코드와 같이 단색 점이 나타나야 하지만 나타나지 않습니다.

<!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>

원인: list-style-position: Outside; 속성으로 인해 발생합니다.

왼쪽 플로트는 박스 모델을 가로로 하나씩 연습하게 됩니다.

목록 기호의 위치가 상자 모델 외부에 있으므로

두 번째 목록 항목의 기호가 첫 번째 목록 항목에 가려집니다

추가 적용 float: left; 속성도 LI 요소를 비정상적으로 만듭니다.

해결책: list-style-position:outside;를 list-style-position: inside로 변경하거나 부동 설정을 제거하세요.

위 내용은 css:list-style-type 속성이 종종 작동하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.