10个糟糕的IE Bug及其修复(3)
作者:iifksp 来源:蓝色理想 时间:2010-05-13 16:26:00
8、:hover伪类(:hover Pseudo Class)
IE只支持<a>元素的 :hover伪类。你可以使用jQuery的hover event来达到相同效果。
解决方法:
/* jQuery Script */
$('#list li').hover(
function () {
$(this).addClass('color');
},
function() {
$(this).removeClass('color');
}
);
/* CSS Style */
.color {
background-color:#f00;
}
/* HTML */
<ul id="list">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
9、盒模型Hack(Box Hack Model)
这是IE里最热门的bug了。基本的理解是,IE计算宽度(width)的方式不同。基于w3c标准,一个元素总宽度应该是:
总宽度 = margin-left + border-left + padding-left + width + padding-right + border-right + margin-right
但是,IE计算宽度时没有加上填充和边框:
总宽度 = margin-left + width + margin-right
更多的细节,请参考这个链接:Internet Explorer和CSS盒模型详细解释
解决方法:
使用w3c的标准兼容模式。IE6或者之后的版本能基于w3c的标准计算,但是你仍旧会在IE5中遇到问题。
或者你可以用CSS Hack来解决这个问题。所有标准兼容的浏览器都能读取w\\idth:180px 除了IE5。
#content {
padding:10px;
border:1px solid;
width:200px;
w\\idth:180px;
}
10、 双倍边距bug(Double Margin Bug Fix)
如果你有一个分配有左/右边距的浮动元素,IE6会使得边距双倍化。比如,margin-left:5px 将会变成10px。你可以通过对浮动元素添加display:inline来解决这个问题。
解决方法:
div#content {
float:left;
width:200px;
margin-left:10px;
/* fix the double margin error */
display:inline;
}
FIN。谢谢观看
![](/images/zang.png)
![](/images/jiucuo.png)
猜你喜欢
SQL Server数据库触发器安全隐患解析
再谈“字符串拼接”的效率
sql server常用命令行操作(启动、停止、暂停)
网页设计详细教程之XML简便省力技巧五则
一个非常有代表性的javascript简易拖动类
二十八法优化SQL Server数据库查询
rs.getrows的使用方法
ASP读取XML实例 优酷专辑采集程序 雷锋版
asp如何直接调用后台存储过程?
把论坛从ACCESS转成SQL版本
SQL查询不重复记录/删除重复记录
IE下的firebug方法
几个SQL SERVER应用问题解答
深入透析样式表滤镜(上)
SQLserver中字符串查找功能patindex和charindex的区别
为SWFUpload增加ASP版本的上传处理程序
深刻理解Oracle数据库的启动和关闭
ORACLE应用经验(2)
手机验证设计感悟
![](https://img.aspxhome.com/file/UploadPic/20111/20/01-64s.jpg)
对学好网页设计很有价值的一句话
![](https://img.aspxhome.com/file/UploadPic/200710/28/2007102816649948s.jpg)