让我们来看看一些注释 1)由WordPress生成的网页上(它不是一个网站,我维护,我只是想知道是怎么回事).由于这些页面可能在不久的将来消失,我在网上放了一些截图.这是我看到的:
显然,列表项标记不应该存在.所以我决定使用Firebug查看源代码.如您所见,Firebug声称list-style
属性(包含none
)是继承的ol.commentlist
.但如果是这样的话,为什么圆圈和方形可见?检查计算出的样式时,Firebug会list-style-type
正确显示s.
什么是正确的行为?我刚刚在Chromium中进行了快速检查,其Web Inspector更好地了解了现实(列表项标记也显示在此浏览器中):
根据WebKit的,list-style
中ol.commentlist
是不能继承,只有默认值list-style-type
从渲染引擎.
因此,我们可以得出结论,两个浏览器的输出都是正确的,并且Firefox(Firebug)显示了继承样式的错误表示.什么是CSS规范说什么?
继承会将 元素的
list-style
值OL
和UL
元素传递给LI
元素.这是指定列表样式信息的推荐方法.
没有太多关于s 的ol
属性继承ul
.Firebug在这方面是错误的还是应该ul
从ol
s 嵌套s继承(某些)属性(如果是这样,为什么不是在两个完全不同的浏览器中相应地呈现的元素)?要清楚,我的实际问题是:嵌套ul
元素应该从ol
包含它们的元素继承哪些属性?
编辑:我忘记了Opera,看到浏览器的检查员时,图片变得更加清晰:
正如右窗格所示,嵌套ul
元素确实从ol
元素继承属性,但浏览器的默认值为list-style-type
和list-style-position
覆盖其父元素指定的属性.
由于Vinhboy支持我怀疑这是某个地方的错误(Firefox?Firebug?),我提交了一个错误报告.
顺便说一句,我设法通过改变style.css的312行来让标记消失
ol.commentlist, li.commentlist, ul.children {
当还明确定义list-style
的ul.children
到none
的标记不涂.如果您愿意,可以在这种情况下查看Firebug和WebKit的Web Inspector的屏幕截图.
1)在联系页面开发人员后,他修复了不需要的列表标记,因此您无法再看到此问题(无需动态编辑CSS).您仍然可以查看屏幕截图以了解这是什么,但我也做了一个测试用例并将其添加到我的错误报告中.为了方便每个人,HTML/CSS源代码如下:
<ol>/<ul> inheritance test case
- First item
- Second one
- Now let's have some fun with a nested <ul>:
- First item
- And the second one again (this is incredibly boring, but it's just an example)
- Ho hum
- Are you still there?
- Just another item
只需选择ul
并注意Firebug说它继承了列表样式属性ol
(虽然它没有,当我们查看实际呈现的页面时).
请将其与WebKit的Web检查器进行比较,尤其是Opera变体.后者明确表明它回退到浏览器的默认值list-style-type
和list-style-position
.