css - 为什么 IE 能正确解析长度为 4 而不是 3 的文本阴影？

Question

这是来自 MS 测试的 CSS 代码示例:

text-shadow: blue 1px 1px 1px 2px;

它真的按照任务所说的去做 - 显示蓝色阴影。但是怎么办？根据 w3schools，text-shadow 的语法是:

text-shadow: h-shadow v-shadow blur-radius color|none|initial|inherit;

即3 个数字，然后是颜色。

根据 https://msdn.microsoft.com/en-us/library/windows/apps/hh441185.aspx , 语法是:

Required: The first length is the horizontal offset of the shadow. A positive value draws a shadow that is offset to the right of the box, a negative length to the left.

Required: The second length is the vertical offset. A positive value offsets the shadow down, a negative one up.

Optional: The third length is a blur distance. Negative values are not allowed. If the blur value is zero, the shadow's edge is sharp. Otherwise, the larger the value, the more the shadow's edge is blurred.

Optional: The fourth length is a spread distance. Positive values cause the shadow shape to expand in all directions by the specified radius. Negative values cause the shadow shape to contract.

Optional: The color is the color of the shadow.

但在“正确答案”中，颜色排在第一位! IE11 按预期显示它，但 Firefox 和 Chrome 根本不显示阴影。

问题是:IE 的行为是否正确？

我会不会通过考试？我是否应该(作为 Web 开发人员)始终牢记这些疯狂的小差异？

Answer 1

IE 支持文本阴影的扩展半径。 Chrome 和 Firefox 没有。 组件在属性值中的位置无关紧要。

传播半径好像是deferred to Text Decorations level 4 , 因为它 does not appear in the level 3 spec (事实上​​ ，它专门说“不允许传播值(value)[...]”)。这可以解释为什么 Chrome 和 Firefox 不支持它。令人惊讶的是，IE 确实如此，因为众所周知，在规范成熟之前，Microsoft 会推迟支持并非由他们自己编写的实验性 CSS 规范。