遇到的浏览器兼容性问题

1，在清除浮动时，使用after伪元素方法比较好，不用修改html代码，css中的：after可以父容器的尾部生成一个子元素，这样就可以直接在伪元素中添加clear：both来清除浮动了，例如（content ：“ ” 是指在结尾创建一个空白字符，也可以加上height：0使这个空白字符不显示出来）,clearfix是父元素的类名

.clearfix:after{
content:"";
display:block;
clear:both;
}

但是：after在IE6中不支持，这改怎么办？

这是只需添加一条IE6独有的命令zoom：1就行，就来激发父容器的hasLayout属性，使父元素拥有自己的布局，其他浏览器则会忽略这条命令。

所以兼容性写法是这样的

.clearfix:after{
   content:"";
   display:block;
   clear:both;
}
.clearfix{
   zoom:1;
}

2.不同浏览器默认的margin和padding不同，这是几乎最常见的兼容性问题，

解决方案：css开头加

*{margin: 0;padding: 0;}

3.border:0和border:none

ie6,ie7下，border:0解析为border-width:0，border:none解析为border-style:0;

标准浏览器下border:0比border多渲染一个border-width:0，所以为了优化内存，写了一个兼容性写法

border：0 none；（0针对ie6，7，none针对标准浏览器）

4.vue.js兼容性

Vue.js 不支持 IE8 及其以下版本，因为 Vue.js 使用了 IE8 不能模拟的 ECMAScript 5 特性。Vue.js 支持所有兼容 ECMAScript 5 的浏览器。