来一波CSS兼容问题小总结吧

时间:2021-07-07 08:25:09

1.DOCTYPE 影响 CSS 处理;

2.火狐 谷歌等浏览器 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !important 多设一个 height 和 width

3.火狐 谷歌等浏览器支持 !important, IE 则忽略, 可用 !important 为 FF 特别设置样式

4.div 的垂直居中问题: vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了。缺点是要控制内容不要换行;

5.在mozilla firefox和IE中的BOX模型解释不一致导致相差2px解决方法:div{margin:30px!important;margin:28px;}

6.ul和ol列表缩进问题 消除ul、ol等列表的缩进时,样式应写成:list-style:none;margin:0px;padding:0px;

7.CSS透明问题 IE下写法:IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)。其他浏览器写法:opacity:0.6;

8.CSS圆角问题IE7以下不支持圆角,其他浏览器需要加上自己的前缀;

9.给元素添加小手图标时都是用:cursor:pointer;

10.字体大小small的定义不同,谷歌,火狐等浏览器下的13px,在ie中为16px,差别较大,解决方法:使用指定的字体大小如14px;