常见兼容性问题

最新推荐文章于 2020-09-07 21:35:04 发布

ruby_xc

最新推荐文章于 2020-09-07 21:35:04 发布

阅读量334

点赞数

分类专栏：前端学习文章标签： ie 6 浏览器

本文链接：https://blog.csdn.net/ruby_xc/article/details/78076111

版权

前端学习专栏收录该内容

37 篇文章 0 订阅

订阅专栏

常见兼容性问题

png24位的图片在IE6浏览器上出现背景 => 做成png8，也可以引用一段脚本处理
浏览器默认的margin和padding不同 => 加一个全局的*{margin:0; padding:0; }来统一
IE6双边距bug：块级元素float之后，又有横行的margin，所以在IE6显示的margin比设置的大

#box{
        float: left;
        width: 10px;
        margin: 0 0 0 10px;
    }
    //这种情况下IE会产生20px的距离 =>在float的元素样式中加入_display: inline;(_这个符号只有ie6识别）

使用“\9”这一标记，将IE游览器从所有情况中分离出来。接着，再次使用“+”将IE8和IE7、IE6分离开来，这样IE8已经独立识别

#el {
        background-color: #000; /*所有识别*/
        .background-color: #000\9; /*IE6、7、8识别*/
        +background-color: #000;  /*IE6、7识别*/
        _background-color: #000;  /*IE6识别*/
}

怪异模式问题：漏写DTD声明，firefox仍然会按照标准模式来解析网页，但IE会触发怪异模式 => 避免怪异模式在文档顶部书写dtd声明：<doctype html>
上下margin重合问题：相邻兄弟元素在垂直方向上的margin值会呈现重合的情况，重合后会取两个元素里较大的的值作为重合后的值 => display: inline_block