云南龙网

  1. 首页 > 云知道 > >

浏览器兼容之旅第四站:IE常见Bug总结及修复方法—part2( 二 )

云知道


}
或
img src="/images/defaultpic.gif" /

方法二：DD_belatedPNG.js
可以使用DD_belatedPNG来产现，具体实如何实现，大家可以参考前面我所整理的《Drupal7中解决IE6的png透明问题》一文 。或者在ＧＧ和度娘中直接搜索关键字fix PNG Transparency for ie6 将会有一大堆关于解决IE6下的PNG透明问题 。

四、IFrame透明背景Bug
这个Bug是有关于iframe有背景透明问题在Firefox和Safari中，你应该不会遇到这个问题，因为默认情况下，iframe的背景设置为透明，但在IE浏览器，它不会 。你需要在iframe中设置［allowTransparency=true］，并在调入的页面中设置其body的background-color为transparent:
HTML Markup

复制代码代码如下:
iframe src="/images/defaultpic.gif" /iframe

而且需要在iframe中调入的content.html中设置其body的背景色：

复制代码代码如下:
body {background-color: transparent;}

五、禁用IE浏览器默认的垂直滚动条
默认情况下，IE显示垂直滚动条，即使内容很好地适合窗口 。你可以使用overflow:auto来改变，设置他需要时显示出来

复制代码代码如下:
html {
overflow: auto;
}

六、IE6下:hover伪类Bug
在IE6下只支持a:hover的效果，对于其他元素的:hover状态都不支持的 。对于这个bug最好的解决办法就是使用jQuery或js来解决，下面我们一起看一个jQuery的解决方案
HTML Markup

复制代码代码如下:
ul id="list"
liItem1/li
liItem2/li
liItem3/li
/ul

Css Code

复制代码代码如下:
.hover {
background: #f00;
}

jQuery Code

复制代码代码如下:
$(’#list li’).hover(function () {
$(this).addClass(’hover’);
},function() {
$(this).removeClass(’hover’);
});

上面的方法是通过jQuery中的.hover()以及.addClass()和.removeClass()几种方法共同实现 。有关于.addClass()和.removeClass()也可以参阅《jQuery中.addClass()和.removeClass()》一文的相关介绍 。

七、修复min-width/max-width和max-heigt/min-height的Bug
上一节《浏览器兼容之旅的第三站:IE常见Bugpart1》中，我们就得知：在IE6下，他是不识别min-height属性的，其实他不单单不识别min-height属性，而且他还不演识别max-height,min-width,max-width等属性 。这是对于前端攻城师来说又是一个非常棘手的问题，因为许多布局方案中都时常会用到这些属性，才能更好的工作 。在现代浏览器中，你可以轻松的像下面那样轻松的使用这些属性就能正常工作：

复制代码代码如下:
div.max-height {
max-height: 300px;
}
div.min-height {
min-height: 300px;
}
div.max-width {
max-width: 300px;
}
div.min-width {
min-width: 300px;
}

上面这些在IE6下是不识别的，换句话说是无法正常工作的，因为他们完全不明白这些基本的CSS属性 。不过幸运的是，IE浏览器有一套其自己的专有属性，就是使用javaScript表达式来操纵(X)HTML的文档属性，比如说我们这里所说的min-width,max-width和min-height，max-height等属性 。不过使用IE的专有属性有两个缺点：

表达式是基于javaScrpt脚本上运行，如果用户的浏览器不支持javaScript或禁用了javaScript时，那么在用户浏览器上将无法正常运行；
另外使用IE的专有属性表达式是非常耗费资源，同时也可能产生负面影响 。
虽然使用IE专有属性那不良之处，但有时为了满足用户的完美追求，也只好牺牲一些性能上的条件，来完整的让这几个属性在IE6上正常运行 。

推荐阅读


上一篇：支付宝上的信用卡怎么办理

下一篇：K269使用一年体会