ie8的css兼容性问题

1.不支持box-shadow属性。

解决方法：

使用-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#C7C9CD')";

说明：strength是阴影大小，direction是阴影方位，单位为度，可以为负数，color是阴影颜色 （不支持rgba格式）

                使用IE滤镜实现盒子阴影的盒子必须是行元素或以行元素显示（block或inline-block;）

box-shadow: 0 5px 10px rgba(33,36,41,0.2);/* for opera or ie9 */ 
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#C7C9CD')";

2.不支持rgba()格式的颜色

如果设置的背景色有一个透明度，则ie8及以下都不支持

解决办法：使用filter滤镜设置渐变。设置startColorstr和stopColorstr为相同的颜色，相同的透明度，即可达到半透明的背景效果。其中颜色字符串中，第1,2个字符表示透明度，例如当前的7f表示0.5的透明度，其他值自行去查；后面6个字符既是颜色的十六进制格式。

background-color: rgba(29,61,103,.5); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f1D3D67,endColorstr=#7f1D3D67);

3.不支持opacity属性

解决方法： 使用filter滤镜。注意：在使用filter滤镜设置不透明度时，需要给该元素设置背景色，否则设置的不透明度将没有任作用。这个属性一旦设置成功，那么该属性里的元素或者文字都会有设置的透明度。

background: #fff;
opacity: 0;
 filter: alpha(opacity=0);/*兼容ie8及以下*/

4.常用的css3选择器的支持性

    1）支持:first-child，不支持:last-child选择器，尽量避免使用last-child选择器 。
    2）支持:after和:before选择器
    3)  不支持:nth-child选择器
    4）不支持:not()选择器
    5）不支持:checked，:disabled
    6）支持属性选择器，如[attribute^=value]，[attribute$=value]，[attribute*=value]等

5.不支持border-radius属性

解决方法，可通过pie.js补丁文件解决 
下载pie补丁文件，放入项目中

补丁文件的内容

然后在页面中引用

<!-- [if it ie 9] -->  
<!-- <script src="/static/plugins/pie/PIE.js"></script> -->
<!-- <[!endif] -- >

border-radius: 4px;
behavior: url(/static/plugins/pie/PIE.htc);

但是使用这个补丁可能会有一些意想不到的问题，所以根据实际情况而定

6.ie9及以下都不支持渐变

解决方法：使用如下方法代替。startColorstr，endColorstr渐变的开始颜色和结束颜色，格式是AARRGGBB，gradiendtType是渐变的方向，1是水平渐变，0是垂直渐变。

progid:DXImageTransform.Microsoft.gradient(startColorstr='#B2FFFFFF',endColorstr='#00FFFFFF',GradientType=0 );

7.其他属性兼容性说明

    1）ie9及其以下都不支持css3的@keyframe 规则或 animation 属性，尽量避免使用
    2）不支持css3的transform属性（ie9支持代替的-ms-transform属性，仅适用于2D转换
    3）不支持background-size属性和border-image属性

8.不支持canvas，和svg

解决方法：使用vml代替，绘制图形

9.不支持placeholder属性

解决方法：自己写一个input组件，使用blur和focus事件来实现placeholder的效果。

`<div>ddd</div> `

ie8的javascript兼容性问题