打印

[CSS] 当ul/ol列表拥有layout后

当ul/ol列表拥有layout后

当ol li拥有 layout 时,有序的数字列表li似乎把自己重新独立的计算显示为1, 而直接跳到下一个序号。 给第三个li定义高度令其获得layout  1.解析欧洲杯A组,C罗成最大看点  2.刘翔已具备在尤金比赛的能力和条件  1.社会应给高考学生更多人性关怀 4.解析欧洲杯A组,C罗成最大看点  5.刘翔已具备在尤金比赛的能力和条件  6.社会应给高考学生更多人性关怀 以下是原文转过来。地址:http://blog.gulu77.com/?p=43
引用:
又是layout惹来的麻烦,在IE中当ul/ol里的li拥有layout后会影响列表的表现。这奇怪错误是IE独有的BUG,恐怕只有Microsoft的制作团队才能解决,我们可以做到的只有设法绕过这错误表现避免使用拥有layout css属性。具体请参考以下实例 实例1:当ul列表拥有layout 当ul li拥有 layout 时,列表符号会底部对齐(而不是按照预料的顶部对齐)。 deom1: http://blog.gulu77.com/demo/200806/listDeom1.html 解决方案:可以使用 vertical-align:top; 令列表符号按顶部对齐 deom2: http://blog.gulu77.com/demo/200806/listDeom2.html 实例2:当ol列表拥有layout 当ol li拥有 layout 时,有序的数字列表li似乎把自己重新独立的计算显示为1, 而直接跳到下一个序号。 deom3: http://blog.gulu77.com/demo/200806/listDeom3.html 解决方案:可以使用line-height 来替换 height 因为 line-height不会令元素拥有layout deom4: http://blog.gulu77.com/demo/200806/listDeom4.html 补充说明列表对:position:absolute; 跟 float: left|right; 解析 position:absolute; 跟 float: left|right; 属性值将显示了更高级的错误, 他们连数字也没办法显示出来. deom5: http://blog.gulu77.com/demo/200806/listDeom5.html ul/ol里的li拥有layout后会影响列表的表现,要如何能控制该元素样式同时令其不会具有layout,方法很多只要你去想。 例如: width会使用元素拥有布局,那么我们要如何给LI定义宽度呢? 答案是在父级定义width使li承继。 height同样会使用元素拥有布局,可以使用不具拥有布局的line-height来代替。

TOP

如果不是遇到这样的问题。。。一直没发觉有序列表还有这种问题。。 以后想设置li的全局属性要注意。。。

TOP