首页 > 代码库 > 【浏览器兼容】IE8
【浏览器兼容】IE8
1.不支持rgba
2.支持:first-child却不支持:last-child
3.th会text-align:center,所以要在css开头设定th {text-align:inherit}
4.display:none中的图片不会加载
5.$(window).on(‘keydown‘)无效。只能使用$(document)
6.同上,click也无效。
7.IE7和IE8下png图片背景变黑的bug解决方案:
【需要注意的是<img>不要加position,relative也不行】
http://blog.sina.com.cn/s/blog_73032b2f0101g4rl.html
1、不要直接改变图片的透明度,而是给图片套个容器,去修改这个容器的透明度
比如原代码是:
<img src="http://www.mamicode.com/style/images/icon-shadow.png" class="share-list-icon-shadow" />
修改成
<div class="share-list-icon-shadow"><img src="http://www.mamicode.com/style/images/icon-shadow.png" /></div>
2、给这个容器加个背景颜色
非常重要,解决bug的关键就在这一步,比如:
.share-list-icon-shadow{
width:60px;height:21px;
position:absolute;bottom:8px;left:0px;z-index: 1;
margin: 0 auto;
display:block;
background:#FAFDEF;
}
一般情况下,到此bug就解决了,如果还是有问题,请看下面:
3、给容器加个zoom: 1
8.jQuery fadeTo 时ie8 png图片有黑色边框: 【未验证】
http://www.cnblogs.com/djiz/p/3323754.html
往带有png图的样式里加 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true);
例如:.imageContainer img{display:block;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true);}
9.opacity会对子元素生效,但如果子元素设定position:relative,opacity不会生效。
10.使用jq的on绑定mousemove事件,只能在$(document)上绑,window和body都不行。
11.mouseup和mousedown事件也是同上。
12.IE8不支持inline-block,需要使用inline与zoom:1
13.inline与zoom:1,好像会使得背景图片无效
14.综12,13所述,IE8下使用float可能才会有合理的表现。
15.IE8的有效css hack之一是媒体查询@media (min-width: 0px) { }
16.js中写this.delete会报错
17.scope.export会报错
18.阴影必须有background才会生效
-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=315, Color=‘#bbbbbb‘)";
19.接上,IE8的阴影似乎是会视为内边距
20.[{},]结果是[{}, undefined]
【浏览器兼容】IE8