如果 CSS 选择器包含地址元素,Firefox 将拒绝样式元素 [英] Firefox refusing to style element if CSS selector contains address element

查看:26
本文介绍了如果 CSS 选择器包含地址元素,Firefox 将拒绝样式元素的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如果我在 CSS 选择器中使用

元素,Firefox 似乎拒绝为 html 元素设置样式.

Firefox appears to be refusing to style an html element if i use the <address> element in the CSS selector.

示例:

<footer>
    <address>
        <ul>
            <li id="email_address">email@website.com</li>
            <li id="phone_number">(555) 555 - 5555</li>
        </ul>
    </address>
</footer>

address li { color: #0000ff; } /* fails */
#phone_number { color: #ff0000; } /* works as expected */

我在 FF 3.6.12 上看到了这个,在 Safari 5.0.3 中按预期工作

I'm seeing this on FF 3.6.12, works as expected in Safari 5.0.3

知道为什么会这样吗?

推荐答案

原因其实很简单.Firefox 3.6 还不符合 HTML5 草案规范.使用 Firebug 检查

元素,我们可以看到 Firefox 看到的内容:

The reason for this is actually quite simple. Firefox 3.6 does not conform to the HTML5 draft specifications yet. Inspecting the <address> element with Firebug, we can see what Firefox sees:

<footer>
    <address>
        </address><ul>
            <li id="email_address">email@website.com</li>
            <li id="phone_number">(555) 555 - 5555</li>
        </ul>
</footer>

如您所见,Firefox 以某种方式解释了您的 HTML,如上所示.

元素现在是空的,因此
  • 元素没有样式.

    As you can see, Firefox has somehow interpreted your HTML as shown above. The <address> element is now empty, and thus the <li> elements are not styled.

    但是为什么呢?查看HTML4 规范,我们可以看到

    元素 是一个 内联 元素(如 Alohci 在评论中)应该只包含内联元素.

    But why? Looking through the HTML4 specifications, we can see that the <address> element is an inline element (as stated by Alohci in the comments) should only contain inline elements.

    <!ELEMENT ADDRESS - - (%inline;)* -- information on author -->
    <!ATTLIST ADDRESS
      %attrs;                              -- %coreattrs, %i18n, %events --
      >
    

    由于 Firefox 3.6 不符合 HTML5 规范,至少对 Firefox 而言,您上面使用的 HTML 无效,浏览器处理未指定行为的方式是它们破坏,如图所示多于.

    Since Firefox 3.6 does not conform to the HTML5 specifications, to Firefox at least, the HTML you used above is not valid, and the way browsers deal with unspecified behavior is that they break, as shown above.

    没有办法解决这个问题 - HTML5 仅处于起草阶段,浏览器不需要以任何方式符合它们.您可能希望向 Mozilla 的 Bugzilla 错误跟踪系统提交错误报告.

    There's no way to fix this - HTML5 is only in the drafting stages, and browsers are not required to conform to them by any means. You may wish to submit a bug report to Mozilla's Bugzilla bug tracking system.

    这篇关于如果 CSS 选择器包含地址元素,Firefox 将拒绝样式元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

  • 查看全文
    登录 关闭
    扫码关注1秒登录
    发送“验证码”获取 | 15天全站免登陆