list-style:noneoutsidenone;的作用

list-style:noneoutsidenone;的作用

今天在论坛里面看到一篇文章,讲的是以前忽略的一个问题。就是当ul里面有float和display:inline,在ie6、ie7里面会有一些问题。一般对ul进行reset也好,或是设置ul的样式时,往往要写list-style-type:none,有时偷懒点写list-style:none。这个在ff、ie8下面显示正常,列表符隐去不见,li里面的内容与框之间没有距离,但是在ie6、ie7里面虽然也会隐去列表符,但是会保留列表符在li里面占得位置。

废话少说直接上代码:

<style type="text/css">
body,ul,li,p {padding:0;margin:0;font-size:12px;}
p{font:bold 16px/180% arial;}
div{float:left;display:inline;background:#eee;margin-right:10px;}
p span{text-decoration:line-through;}
ul{width:275px;margin:4px 0 0 15px;background:aqua;}
.ul01{float:left;display:inline;}
.ul01,.ul01 li{list-style:none ;}
</style>

<div>
<p>1:list-style:none;</p>
<ul>
<li><ahref="#">aaaaaaaaaaaa</a></li>
<li><ahref="#">aaaaaaaaaaaaaaaaa</a></li>
<li><ahref="#">aaaaaaaaaaaaaaaaaa</a></li>
<li><ahref="#">aaaaaaaaaaaaaaaaaaa</a></li>
<li><ahref="#">aaaaaaaaaaaaaaaaaaaaaaaaaa</a></li>
<li><ahref="#">aaaaaaaaaaaaaaaaaaaaaaaaaaa</a></li>
<li><ahref="#">aaaaaaaaaaaaaaaaaaaaaaaaaa</a></li>
<li><ahref="#">aaaaaaaaaaaaaaaaaaaaaaaaaaaa</a></li>
<li><ahref="#">aaaaaaaaaaaaaaaaaaaaaaaaaaaa</a></li>
</ul>
</div>
</body>

效果如图:ff下正常显示
ie6、ie7下面的效果

先可以在firebug里面看看list-style包含的属性有哪些:

造成ie6、ie7下面这种效果差别,是因为属性list-style-position:inside是他们的默认值即使设置了list-style:none。当UL不具有float和display:inline;时,无论有没有list-style:none这个属性,列表符都被隐藏,不占位置。

原文请到http://www.blueidea.com/tech/web/2010/7616.asp上看,那里有详细的解释



  

爱华网本文地址 » http://www.413yy.cn/a/25101012/126631.html

更多阅读

藕粉的作用与功效 藕粉会发胖吗

华夏璀璨,睿智之选;乐于奉献,王者风范!对,这就是作家俺一贯保持的作风。闲来无事给大家说说这个藕粉:藕粉是久负盛誉的传统滋养食品,而且营养价值高,药疗作用好。口感不错、鲜美独特,老少皆宜。藕粉的作用与功效——工具/原料想、必,得多百度

乌龙茶的功效 蜂蜜水的作用与功效

乌龙茶中含有大量的茶多酚,可以提高脂肪分解酶的作用,降低血液中的胆固醇含量,有降低血压、抗氧化、防衰老及防癌等作用。最近发表在《肥胖期刊》上的一项研究指出,经常喝乌龙茶的人,身体质量指数和脂肪含有率都比少喝的人低。而且,女人减

莲子的作用及食用方法 石榴的功效与作用

莲子性味甘平,每500克莲子中含有热量1500大卡左右,莲子的功效主要有:化痰止咳,降血压血脂,还可以壮阳,补脑安神之功效。莲子的作用及食用方法——莲子的功效性平、味甘涩,入心、脾、肾经;补脾止泻,益肾涩清,养心安神。用于脾虚久泻,遗精带下,心

酵素的作用与功效 酵素的副作用

酵素的作用与功效——简介 亚健康人凡有肩膀疼痛、四肢无力、疲倦、头晕眼花、食欲不振等都是“半(亚)健康症”,处在压力过大的现代人或多或少都有上述情况,半(亚)健康症状就是酵素作用“短路”,问题越严重,就越可能变成疾病。酵素能充分发

键盘空格键的作用有哪些? 键盘空格键失灵

键盘空格键的作用有哪些?——简介键盘空格键,顾名思义就是敲出空格的按键,那么,它除了能敲出空格外,键盘空格键的作用还有哪些?键盘空格键的作用有哪些?——工具/原料电脑键盘键盘空格键的作用有哪些?——方法/步骤键盘空格键的作用有哪些?

声明:《list-style:noneoutsidenone;的作用》为网友落魄潇洒分享!如侵犯到您的合法权益请联系我们删除