Internet explorer 为什么在这个IE CSS黑客拼写错误?

Internet explorer 为什么在这个IE CSS黑客拼写错误?,internet-explorer,Internet Explorer,有人能向我解释一下为什么这个IE黑客的宽度属性拼写错误吗 * html #container a.slided { width:91px; w\idth:93px; } 顺便说一句,下面是我看到代码的链接: 早期版本的IE(不兼容)不理解带有反斜杠的属性,因此在您的示例中,会将宽度设置为91px。兼容浏览器可以理解这两行,但是CSS的级联特性意味着第一个值被下一个值覆盖,所以他们将宽度设置为93px 这是一种克服IE中的破盒模型的方法,在IE中元素尺寸的计算不同,导致布

有人能向我解释一下为什么这个IE黑客的宽度属性拼写错误吗

* html #container a.slided {
    width:91px;
    w\idth:93px;
    }
顺便说一句,下面是我看到代码的链接: 早期版本的IE(不兼容)不理解带有反斜杠的属性,因此在您的示例中,会将宽度设置为91px。兼容浏览器可以理解这两行,但是CSS的级联特性意味着第一个值被下一个值覆盖,所以他们将宽度设置为93px


这是一种克服IE中的破盒模型的方法,在IE中元素尺寸的计算不同,导致布局噩梦

基本上,这是因为早期版本的IE不知道如何忽略反斜杠。他们只是说“我不认识这个属性”,而忽略了整句话。其他浏览器在寻找理解给定代码的方法方面更聪明一些,例如,忽略反斜杠

这为我们提供了一种方便(尽管不符合标准)的方法,让IE忽略一行CSS。所有浏览器都读取第一行并将宽度设置为91px。然后样式表会说“嘿,如果你不是IE,你应该将你的宽度设置为93px。”因此,更智能的浏览器可以做到这一点,让我们可以告诉IE我们需要什么,而不会干扰所有其他浏览器的布局。

这被称为

  • *html
    部分对IE 6及以下版本以外的浏览器隐藏规则。IE6显然认为
    html
    元素有一个父元素

  • IE 5.0和5.5 for Windows错误地将带有反斜杠(
    w\idth
    )的规则解析为不适用,违反了

  • 拼写正确的
    width
    规则在IE 6 Windows和IE 5 Mac中被覆盖,它们没有特定的CSS解析错误。(以后的CSS规则优先于以前的规则。)

因此,在具有触发标准模式的doctype的页面中,W3C框模型(适用于IE 6窗口和IE 5 Mac)下的宽度为
w\idth
,而传统(边框)框模型(适用于IE 5窗口)下的宽度为
width

除非您需要支持IE5(早已过时),否则这种攻击是不必要的