CSS Hack 技术
2006-12-13 22:18 Jeffrey Lee 阅读(439) 评论(0) 编辑 收藏 举报CSS的定义如下：
1
div.content {
2
width:400px;
3
voice-family: “\”}\”";
4
voice-family:inherit;
5 width:300px;
6}
7
8html>body .content {
9 width:300px;
10}
div.content {
}2
width:400px;3
voice-family: “\”}\”";4
voice-family:inherit;5
width:300px;6
} 7
8
html>body .content {9
width:300px;10
}或者
html>body #left {
width: 120px; /* ie5win fudge ends */
width}这种习惯出现在为IE５解决CSS1时代Width的bug。因为在IE5中，设置width的时候，浏览器会把border，padding全部算进去了，而正确的显示（也是IE后续版本），应该是width不包括border，padding的（以及margin）。所以为IE5设置宽度时候，需要特别考虑到border和padding，因此这个值要比正常值更大。
为了达到这个目的，在设置一个元素宽度时候，利用了IE5中的一个bug－即对voice-family赋值为”\”}\”"，这个在IE5下面会导致解释成“｝”结束符，以致这个CSS下面的设置不在生效。而对于后续IE和其他的浏览器版本会继续执行下面的设置，因而可以给width再次赋值，以覆盖掉前面的设置。通常我们会追加一个类似 html>body .content 声明，这是CSS2中选择元素的一种方式，用来再次声明其中的width设置，而在IE5中下一样不会被执行。
在此感谢网友Chagel的解答 :)
