CSS浏览器兼容解决方案

1.在ie8的甑别上,如何让样式只对ie8起作用?

用ie浏览器独有的文档注释的方式。像这样:

<!DOCTYPE html>
<!--> <html class="ie8" lang="en"> <!-->
<!--> <html class="ie9" lang="en"> <!-->
<!--><!-->
<html lang="en"> <!--<!--> 

只需要在独立对ie8应用样式规则的地方,copy该条规则,然后在前面加上 .ie8然后就能随便写了,对付ie9也一样。

2.360双核浏览器,添加以下头部meta信息可以使得网页用webkit内核渲染:

<meta name=”renderer” content=”webkit”>  表示强制要求360浏览器用chrome的内核渲染网页。

3.ie8的css兼容:

     1.ie8支持:first-child,但不支持:last-child。因为前者是css2.1标准,后者是css3标准。注意:如果浏览器不支持的选择器和支持的选择器写在一起,那么整条规则就不起作用了。

     2. input设置了左右padding,但输入较多内容时padding还是会消失。方法是在input 外面套一层div,用div设置左右padding,border,width和height,input只需要设置width和weight为100% 即可。另外,如果没有明确设置height的值,那么设置的line-height值就是height的值,但对于ie8,如果input 设置了 line-height,那么input必须设置height,否则input的内容显示有问题,会上下隐藏部分内容。

      3.input,img,iframe等元素不支持伪元素

      4.父元素的左padding会和子元素的左margin重叠。

      5.sprite图中的icons之间最好留空白间隔,哪怕间隔1px也好。

原文地址:https://www.cnblogs.com/mo-cha/p/5623602.html