IE9 不喜欢 CSS 中的裸数字？答案

【问题标题】：IE9 doesn't like naked numbers in CSS?IE9 不喜欢 CSS 中的裸数字？
【发布时间】：2011-10-28 18:05:16
【问题描述】：

这适用于 Chrome、Safari 和 Firefox，但不适用于 IE9

style='height:100'

IE9 只是忽略它。但这确实有效：

style='height:100px'

不幸的是，我真的不想在我的所有值中添加一个“px”。它使进行任何类型的操作（例如，将宽度乘以 2、将宽度加 100 等）都非常麻烦。这是预期的行为吗，我可以在某处设置任何特殊标志以使 IE9 接受第一个示例吗？

（我知道内联样式通常被认为非常糟糕，但我有理由在某些特殊情况下使用它们）

【问题讨论】：

您可能打算使用100%，在这种情况下，所有这些浏览器都会出错。 CSS 确实要求您具体说明您的单位。
当您说“任何形式的操作都非常麻烦”时，您指的是 JavaScript，还是？
“任何类型”意味着任何东西。 Javascript，Python等。我给出的例子几乎总结了它。而不是 x = x * 2 我现在有 x = (parseInt(x) * 2) + "px"，它的字符数大约是原来的两倍，有很多可爱的杂物掩盖了操作的目的，仅此而已周围恶心。 Python 会是类似的，除非我完全遗漏了什么？事实上，我根本看不出任何方式，任何形式的操作都不会非常麻烦，无论语言如何，操作是简单还是复杂，无论我是很少做还是经常做。
好吧，你要么忍受这些杂乱无章的东西，要么编写函数来抽象它。例如，使用jQuery 你可以使用var x = $('#myDiv').width(); x = x * 2; $('#myDiv').width(x);。
除了三十点所说的，您还可以使用 jQuery 尺寸插件来帮助您 (bramstein.com/projects/jsizes)

标签： html css styles

【解决方案1】：

style='height:100' 可能在一些宽容的浏览器中工作，但实际上是无效的 CSS，所以 IE 完全有权拒绝解析这些。

【讨论】：

这与浏览器的“容忍度”无关——没有（？）浏览器会在“标准模式”下允许这样做。大多数（全部？）浏览器都有一个“怪癖模式”，可以让这样的事情溜走，这里有一些关于 Firefox 的文档：developer.mozilla.org/en/mozilla_quirks_mode_behavior
你是对的，但在最初的问题中，Chrome、Safari 和 Firefox 似乎处于 Quirks 模式，我猜 IE9 也应该如此。不同的浏览器在 Quirks 模式下可能容忍不同的错误，这就是我所说的“容忍”。

【解决方案2】：

我在这里看不到“裸”数字 :) http://www.w3.org/TR/CSS21/visudet.html#the-width-property 因为 100 可以是 px，em..

"使用长度单位指定内容区域的宽度。"

【讨论】：

【解决方案3】：

由于 CSS 无效，该 (width:100) 在任何这些浏览器中实际上都不起作用：

http://jsbin.com/ovewus

<div style="width:100;background:red">test</div>

..除非您的页面由于没有有效的文档类型而位于 Quirks Mode，如下所示：

http://jsbin.com/ovewus/2 - width:100 有效！

故意为 Quirks 模式编写页面是非常糟糕的，只是不要这样做。

【讨论】：

【解决方案4】：

正如 Gruikya 所说，具有非单位编号的 CSS 是无效的（除非编号为 0，或者样式为 line-height），所以我肯定会建议添加正确的单位。如果您需要对这些单位进行数学运算（我假设使用 Javascript），那么无论如何您都应该使用 parseInt 或 parseFloat，它们会很乐意忽略尾随单位。

【讨论】：

【解决方案5】：

您不应该在没有实际定义单位的情况下定义任何尺寸。你让浏览器猜测你想使用什么单位，因为你没有告诉他们。

根据浏览器所遵循的 CSS 标准，不同的浏览器可能会有不同的处理方式。

CSS2 规范定义的没有单位的规则应该被忽略。它还提到这种行为可能（理论上）在future specification 中发生变化。

【讨论】：