14

考虑 CSS 属性缺少单位（px、em、pt、%）的场景：

<body>
    <div 
        style=  "width:170;
                border:1 dotted PaleGreen;
                background-color:MistyRose">
        The quick brown
    </div>
</body>

问题：

  1. 为什么会回退到px？像素总是首选单位吗？W3C 工作草案或建议中是否定义了任何规则？
  2. 是否有规则强制 UA 回退到首选单位？
  3. 给定上面的例子，以下哪一项是正确的行为：
    • Internet Explorer：在 Quirks 模式下 (IE6,5,4..) 宽度和边框宽度用于回退到 px。由于 IE7（直到现在，IE10RP），如果缺少单元，它会忽略整个规则。因此，这两条规则都被忽略了。
    • Firefox 13：在上面的示例中，宽度回退到 px，但忽略了边框宽度。
    • Chrome 19、Opera 12、Safari 5.1.2：宽度和边框宽度都回退到 px。

注意：在 Microsoft-Connect 上，他们说：

您报告的问题是设计使然。标准模式下的 IE10 会忽略没有符合 CSS 标准的单位的宽度或高度。该单元不是可选的。

4

2 回答 2

22

我在您的 HTML 中没有看到 doctype 声明，所以我只能假设您的测试页面正在以 quirks 模式呈现。

  1. 为什么会回退到px？像素总是首选单位吗？W3C 工作草案或建议中是否定义了任何规则？

    它只会退回到px怪癖模式（我相信仅适用于某些属性）。是的，px是首选的后备单元。这可以追溯到旧的 HTMLwidth和height接受像素长度作为无单位数字的属性。

  2. 是否有规则强制 UA 回退到首选单位？

    不，因此您观察到的行为不一致。但是，在标准模式下，UA 需要忽略没有单位的长度值；如您引用的 Microsoft Connect 中所述，该单元不是可选的。

    在 CSS2.1中，所有非零长度值都必须有单位。

  3. 给定上面的例子，以下哪一项是正确的行为：

    • Internet Explorer：在 Quirks 模式下 (IE6,5,4..) 宽度和边框宽度用于回退到 px。由于 IE7（直到现在，IE10RP），如果缺少单元，它会忽略整个规则。因此，这两条规则都被忽略了。
    • Firefox 13：在上面的示例中，宽度回退到 px，但忽略了边框宽度。
    • Chrome 19、Opera 12、Safari 5.1.2：宽度和边框宽度都回退到 px。

    同样，基于您的页面处于怪异模式的假设，我只能说，虽然规范提到了怪异行为，但规范中没有定义这种怪异行为的具体细节（无论是明显的还是不-很明显的原因）。

    我猜微软改变了 IE7+ 中的 quirks-mode 行为以反映无单位值的标准行为，因为 quirks 模式存在于所有浏览器中（IE < 6 除外）并且由相同的不正确文档类型或缺少文档类型触发。不过，据我所知，标准模式下的行为并没有改变。

于 2012-06-30T15:05:35.660 回答
0
  1. px是最常用的单位，所以通常浏览器使用他们的“常识”，px如果没有指定单位，它是网页设计中最常用的单位。
  2. 不，没有这样的规则。浏览器只使用设计中最常用的单元。
  3. 理想的行为应该是px在不忽略其他样式的情况下使用并继续前进，但是没有这样的规则，因此当您看到不同的浏览器时，它们实际上正在实现不同的东西，它们实际上正在实现自己的逻辑来应对此类错误，在这种情况下没有可遵循的规则. 这取决于浏览器的功能。

你永远不应该依赖浏览器来纠正你的错误。始终依靠自己获得更好的跨浏览器兼容性

于 2012-06-30T14:39:51.683 回答