常用CSS HACK

时间:2022-03-01 06:47:05

常用CSS HACK

IE6 3像素bug和双边距bug一样的经典

现象:
IE6下浮动元素和不浮动元素之间会有3px间隙(3px bug,div.float-left + div.float-none)

解决
需设置 div.float-left{ margin-right:-3px;}


选择器hack * (只有IE6-能识别)

  • * html IE6认为最外层的元素不是html ,而是* 。 html是*的子元素
    .abc.aclassSelector{} (不存在样式成分忽略 IE6=)

  • *+html selector{} IE7

  • selector,{} (IE6/7 并列关系符不当 包容)

属性前缀hack

  • 前缀 * 只有 IE6/7能识别 *padding-left:50px;

  • 前缀_ _margin-right:-3px; IE6 only

属性值 hack

  • !important (只有IE6不起提升优先级的作用)
    padding-left:50 !important; IE 7/8/9/firefox遇到 !important将提升该样式属性的优先级,IE 6能识别 !important 但没有提升样式属性优先级的作用。

  • \9 (只有IE能识别)
    padding-left:50px \9; IEhack \9,所有IE浏览器都识别 \9

总结

IE 6 css hack : * html, _height, color:blue !important; color:red;

IE 6/7 css hack: *height:100px;

IE css hack: height:100px \9;