ie兼容性问题

ie8不兼容透明度

background:#ffffff; /*支持rgba的浏览器*/
/* older safari/Chrome browsers */
-webkit-opacity: 0;
-khtml-opacity:0;
-moz-opacity:0;
filter:alpha(opacity=0);
filter:"alpha(opacity=0)";
opacity:0; 
/*This works in IE 8 & 9 too*/
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);/*兼容ie8及以下*/ 
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#7f000000',EndColorStr='#7f000000');
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000,endColorstr=#7f000000);

select选择框下的display设置为none时无法隐藏

这个问题可以用js解决，需要option的时候用js添加进去

标签得闭合，要有结束标签

IE8不支持以便签斜杠直接结尾。
页面错位，可能是标签少结束符。

last-child

first-child是CSS2的内容，但是last-child不是，所以IE8不行。
推荐的解决方法不是使用last-child，而是给最后一个元素设置一个.last的class，然后对此进行样式设置，这样就全部兼容了。

img

有边框并且有颜色，边框会占位置
解决方法：img{border:none}

background

#fff url() no-repeat 0/center 

注意：颜色一定在最前面，属性间有空格。

不兼容placeholder

使用js插件：jquery.placeholder.js
https://github.com/mathiasbynens/jquery-placeholder

不兼容text-overflow

overflow: hidden; 
white-space: nowrap; 

这两个属性让起溢出隐藏和不换行,然后IE8用的时候记得不要加

word-berak:break-all; 
word-wrap:break-word; 

这样断开了,在IE8里面是不会变成省略号的
(但是在IE6/7/FF/Chrome都没有问题),其实都单行省略了,本来也没有必要断词
所以一般标准组合就是:

overflow: hidden; 
white-space: nowrap; 
-o-text-overflow: ellipsis; /* for Opera */ 
text-overflow: ellipsis; /* for IE */ 

不兼容line-height

 line-height:32px;
 line-height: 32px\9; /*IE8*/
*line-height: 32px; /* IE7支持 */
_line-height: 32px; /* IE6支持 */
-ms-line-height: 32px;/*IE9+支持*/
-webkit-line-height:32px; /*chrome safair*/
-moz-line-height: 32px;/*火狐*/

不兼容transform

使用filter的Matrix（矩阵）

不兼容border-radius

推荐用背景图代替

ie8不兼容HTML5新标签

HTML5的新标签元素有：

定义页面或区段的头部；
定义页面或区段的尾部；
定义页面或区段的导航区域；
页面的逻辑区域或内容组合；
定义正文或一篇完整的内容；
定义补充或相关内容；