[分享]css兼容ie8写法

CSS兼容IE8写法在CSS编写的过程中，经常会遇到兼容IE8的问题，下面就介绍一些常用的解决方法。1.选择器的兼容写法在选择器的编写中，常用的选择器有id选择器、类选择器、标签选择器、属性选择器等，...

CSS兼容IE8写法

在CSS编写的过程中，经常会遇到兼容IE8的问题，下面就介绍一些常用的解决方法。

1.选择器的兼容写法

在选择器的编写中，常用的选择器有id选择器、类选择器、标签选择器、属性选择器等，其中，类选择器、属性选择器在IE8以下版本中支持不够完善，其中最常用的方法是使用下划线前缀_和星号前缀*来实现。
例如：
/*类选择器兼容写法*/
.box {_height:200px; *height:200px;}
/*属性选择器兼容写法*/
a[class="test"] {_color:red; _text-decoration:none;}

2.盒模型的兼容写法

在盒模型的设置中，常用的属性是box-sizing，可以设置为content-box或者border-box，但在IE8以下版本中，不支持box-sizing属性，可以使用width、height来替代，并结合怪异盒模型解决问题。
例如：
.box {
    _width:200px;
    _height:200px;
    width:180px;
    height:180px;
    padding:10px;
    border:5px solid #ccc;
    /*怪异盒模型*/
    *box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    } 

3.浮动的兼容写法

在浮动的使用中，经常会遇到浮动后父元素高度为0的问题，可以通过给父元素添加overflow:hidden来解决，在IE8以下版本中，可以使用position:relative来解决问题。
例如：
.parent {
    position:relative;
    }
.child {
    float:left;
    }

4.透明度的兼容写法

在设置透明度的时候，可以使用opacity属性，取值范围为0-1，在IE8以下版本中不被支持。可以使用filter:alpha(opacity=50)来实现透明度的效果。
例如：
.box {
    opacity:0.5;
    filter:alpha(opacity=50);
    }

总结

在CSS兼容IE8的设置中，需要结合多种方法来解决问题，可以使用选择器前缀、盒模型、浮动、透明度等多种属性来实现相应效果，不仅能够使页面在IE8以下版本中正常展示，还能够提高页面的兼容性和稳定性。