IE中css控制list-style-type有问题请教前辈。。
IE中css控制list-style-type有问题请教前辈。。。。。希望前辈回答以下两个关于list-style-type的问题。谢谢。。。。。。。。。。。。。。。。。...
IE中css控制list-style-type有问题请教前辈。。。。。希望前辈回答以下两个关于list-style-type的问题。谢谢。。。。。。。。。。。。。。。。。
===================================================================================
问题1：
以下代码在火狐和谷歌可以正常显示list-style-type，而IE不能正常显示list-style-type！：
<!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>无标题文档</title>
<style type="text/css">
<!--
* {
border:0px;
margin:0px;
padding:0px;
}
#HelpConfigRightTd UL {
width:700px;
height:auto;
list-style-type:decimal;
list-style-position:inside;
}
#HelpConfigRightTd UL li{
margin-left:20px;
float:left;
font-size:11px;
color:#333;
line-height:20px;
}
-->
</style>
</head>
<body>
<div id="HelpConfigRightTd">
<ul>
<li>日韩歌曲</li>
<li>港台歌曲</li>
<li>欧美歌曲</li>
<li>摇滚歌曲</li>
<li>经典歌曲</li>
<li>浪漫歌曲</li>
<li>复古歌曲</li>
<li>流行歌曲</li>
</ul>
</div>
</body>
</html>
=================================================================================
问题2：
以下代码在IE、火狐、谷歌都能正常显示，但是我想它li左对齐！如果使用float：left属性和display：block属性和display：inline属性IE不能正常显示了！火狐、谷歌就可以！：
<!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>Untitled Document</title>
<style type="text/css">
ul{list-style:decimal inside;width:900px;height:auto;}
ul li{line-height:30px;}
</style>
</head>
<body>
<ul>
<li>11111</li>
<li>2222</li>
<li>3333</li>
<li>4444</li>
<li>5555</li>
</ul>
</body>
</html>
===========================================================================================
===========================================================================================
希望知道问题所在的网友回答一下！...........Thank。 展开
===================================================================================
问题1：
以下代码在火狐和谷歌可以正常显示list-style-type，而IE不能正常显示list-style-type！：
<!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>无标题文档</title>
<style type="text/css">
<!--
* {
border:0px;
margin:0px;
padding:0px;
}
#HelpConfigRightTd UL {
width:700px;
height:auto;
list-style-type:decimal;
list-style-position:inside;
}
#HelpConfigRightTd UL li{
margin-left:20px;
float:left;
font-size:11px;
color:#333;
line-height:20px;
}
-->
</style>
</head>
<body>
<div id="HelpConfigRightTd">
<ul>
<li>日韩歌曲</li>
<li>港台歌曲</li>
<li>欧美歌曲</li>
<li>摇滚歌曲</li>
<li>经典歌曲</li>
<li>浪漫歌曲</li>
<li>复古歌曲</li>
<li>流行歌曲</li>
</ul>
</div>
</body>
</html>
=================================================================================
问题2：
以下代码在IE、火狐、谷歌都能正常显示，但是我想它li左对齐！如果使用float：left属性和display：block属性和display：inline属性IE不能正常显示了！火狐、谷歌就可以！：
<!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>Untitled Document</title>
<style type="text/css">
ul{list-style:decimal inside;width:900px;height:auto;}
ul li{line-height:30px;}
</style>
</head>
<body>
<ul>
<li>11111</li>
<li>2222</li>
<li>3333</li>
<li>4444</li>
<li>5555</li>
</ul>
</body>
</html>
===========================================================================================
===========================================================================================
希望知道问题所在的网友回答一下！...........Thank。 展开
5个回答
展开全部
你说的都是IE7的问题，不是你的问题。在IE8和IE9里面就没有这些问题，你可以试一下。
而且你这两个问题可以说是同一个问题。
第一个问题的英文解释：http://reference.sitepoint.com/css/list-style-type
这是因为在早期版本的IE中，有一个很重要的属性，叫haslayout,你可以看下百度百科的解释
http://baike.baidu.com/view/2945869.htm但是中文的解释不是很详细，如果你的英文好的话，可以下看这个网页，解释得很清楚http://reference.sitepoint.com/css/haslayout
英文解释里有这么一句话
Internet Explorer for Windows versions up to and including 7 will not increment the list markers in numbering systems if the list item has haslayout.
也就是说直到IE7，只要li有haslayout属性，就不能用增长的数字作为list的样式。
一个li元素怎样才会有haslayout属性呢？
就是你给元素设置了以下属性：
display: inline-block
height: (any value except auto)
float: (left or right)
position: absolute
width: (any value except auto)
writing-mode: tb-rl
zoom: (any value except normal)
Internet Explorer 7 has some additional properties that cause an element to gain a layout (this is not an exhaustive list):
IE7还有跟多的属性，可能会给元素添加layout:(这还不是全部的列表)
min-height: (any value)
max-height: (any value except none)
min-width: (any value)
max-width: (any value except none)
overflow: (any value except visible)
overflow-x: (any value except visible)
overflow-y: (any value except visible)5
position: fixed
我刚转了一篇博客，在参考资料里
而且你这两个问题可以说是同一个问题。
第一个问题的英文解释：http://reference.sitepoint.com/css/list-style-type
这是因为在早期版本的IE中，有一个很重要的属性，叫haslayout,你可以看下百度百科的解释
http://baike.baidu.com/view/2945869.htm但是中文的解释不是很详细，如果你的英文好的话，可以下看这个网页，解释得很清楚http://reference.sitepoint.com/css/haslayout
英文解释里有这么一句话
Internet Explorer for Windows versions up to and including 7 will not increment the list markers in numbering systems if the list item has haslayout.
也就是说直到IE7，只要li有haslayout属性，就不能用增长的数字作为list的样式。
一个li元素怎样才会有haslayout属性呢？
就是你给元素设置了以下属性：
display: inline-block
height: (any value except auto)
float: (left or right)
position: absolute
width: (any value except auto)
writing-mode: tb-rl
zoom: (any value except normal)
Internet Explorer 7 has some additional properties that cause an element to gain a layout (this is not an exhaustive list):
IE7还有跟多的属性，可能会给元素添加layout:(这还不是全部的列表)
min-height: (any value)
max-height: (any value except none)
min-width: (any value)
max-width: (any value except none)
overflow: (any value except visible)
overflow-x: (any value except visible)
overflow-y: (any value except visible)5
position: fixed
我刚转了一篇博客，在参考资料里
追问
问题1：我是在IE6测试的！不是IE7！也没有对IE7、8、9进行测试....！
问题2：还有list-style-type在IE6中不单单decimal值不能正常显示！而是全部list-style-type属性值都不能显示。
问题3：还有你说的【也就是说直到IE7，只要li有haslayout属性，就不能用增长的数字作为list的样式。】那请问..IE6有haslayout属性吗？IE8、9也haslayout属性吗？？？
希望回答以上3个问题！谢谢。
参考资料： http://blog.sina.com.cn/s/blog_57e7d45a0100vb94.html
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
* {
border:0px;
margin:0px;
padding:0px;
}你这个初始了以后。。IE6下就不会出来了
border:0px;
margin:0px;
padding:0px;
}你这个初始了以后。。IE6下就不会出来了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
兼容性问题。
推荐用background设置图片背景的方法实现效果。
推荐用background设置图片背景的方法实现效果。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
兼容性问题，用背景图片吧。。。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
兼容问题的确是个问题
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
