1、IE中如果定义了高度小于15个像素的DIV时，高度显示为15个像素。
IE下，对容器的理解是，容器本来就是用来放置文本内容的，文本内容一定会有字体大小，默认为12px,还有行高，默认为15px，所以这个层就自然的变高了。遇到这种情况，我们将样式加入：line- height:0px; font-size:0px; 就可以解决了。火狐下没有这个问题。
2、超链接访问过后hover样式不显示的问题
改变CSS属性的排列顺序: 先后顺序标准应为：a:link—a:visited—a:hover—a:active
3、ul在Firefox和IE下表现不同
使用（padding:0; margin:0; list-style:inside;）或者（padding:0; margin:0; list-style:none;）实现兼容
4、解决IE不能正确显示透明PNG——header内加入代码
<script language="javascript">
function correctPNG()
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i];
var imgName = img.src.toUpperCase();
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : "";
var imgClass = (img.className) ? "class='" + img.className + "' " : "";
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' ";
var imgStyle = "display:inline-block;" + img.style.cssText;
if (img.align == "left") imgStyle = "float:left;" + imgStyle;
if (img.align == "right") imgStyle = "float:right;" + imgStyle;
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle;
var strNewHTML = "<span " + imgID + imgClass + imgTitle;
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";";
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader";
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>";
img.outerHTML = strNewHTML;
i = i-1;
}
}
}
window.attachEvent("onload", correctPNG);
</script>
5、Li中内容超过长度后以省略号显示的方法
<style type="text/css">
<!--
li{
width:200px;
white-space:nowrap;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
overflow: hidden;
}
-->
</style>
6、IE6的双倍边距的BUG。
解决方法：display属性设置为inline。
分析：块级对象默认的display属性值是block，当设置了浮动的同时，还设置了它的外边距就会出现这种情况。也许你会问：“为什么第二个对象和第一个对象之间就不存在双倍边距的BUG”？因为浮动都有其相对应的对象，只有相对于其父对象的浮动对象才会出现这样的问题。第一个对象是相对父对象的，而第二个对象是相对第一个对象的，所以第二个对象在设置后不会出现问题。
这个现象仅当块级对象设置了浮动属性后才会出现，内联对象（行级对象）不会出现此问题。并且只有设置左边距和右边距的值才会出问题，上下边距不会出现问题。
7、FF下文本无法撑开有固定高度容器。
标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的,那我又想固定高度，又想能被撑开需要怎样设置呢？办法就是去掉height设置min-height:200px; 这里为了照顾不认识min-height的IE6 可以这样定义：
{
height:auto!important;
height:200px;
min-height:200px;
}
8、IE6下的a:hover的bug
<style>
a {}
a span {color: green;}
a:hover {}
a:hover span {color: red; }
</style>
<a href=”http://www.taobao.com“> 淘宝网 <span> 淘你喜欢 </span></a>
在IE7/FF中，鼠标移动到链接上时，”淘你喜欢”字样会变为红色，但IE6则无反应。所以IE6的bug就是如果a 与 a:hover 的css定义是一样的，也就是说如果a:hover 中没有样式的改变，hover就不会被触发。但如果在a:hover{}增加一些特定的属性，例如
a:hover{border:none;}或者a:hover{padding:0;}又或者a:hover{background: none;}
此时hover就可以触发了。这样的属性还包括direction/text-align/text-indent/float/overflow/position …… 等等。我在数码产品畅销榜页面就是选择了使用border:none。
9、层的自动高度实现
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>div自动高度</title>
<style type="text/css">
<!--
.line{ border: 1px dashed #333;}
.con {margin:auto; background-color:#FFFFCC;}
.top{ height:200px; width:80%; background-color:#eee; margin:0 auto 10px auto;}
.cl{ clear:both;}
.con1 { overflow:auto; height:auto;margin:auto; background-color:#FFFFCC;}
.top1{ height:200px; width:80%; background-color:#eee; margin:0 auto;}
-->
</style>
</head>
<body>
<h4>利用clear自动高度，因为TOP层有下边界</h4>
<div class="con line">
<div class="top line"></div>
<div class="top line"></div>
<div class="top line"></div>
<div class="top line"></div>
<div class="top line"></div>
<div class="top line"></div>
<div class="cl"></div>
</div>
<h4>利用overflow和高度的自动高度实现，无下边界的情况</h4>
<div class="con1 line">
<div class="top1 line"></div>
<div class="top1 line"></div>
<div class="top1 line"></div>
<div class="top1 line"></div>
<div class="top1 line"></div>
<div class="top1 line"></div>
</div>
</body>
</html>
10、HTML注释引发的IE6文字溢出和浮动BUG。
不要再两个浮动层之间加注释，去掉注释或者将注释写在层内。
分享到：
相关推荐
从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加 DOCTYPE声名....解决方案是在这个div里面加上display:inlin
滤镜解决方案滤镜从IE4.0被微软正式引入，所以我们可以使用滤镜解决IE6的PNG透明问题，滤镜不仅可以实现目前CSS3的一些旋转效果而且还可以引入图片。注意：此方法在部分版本的IETest中无效，建议使用标准的IE6来进行...
Sail 采用模块化方式开发，功能强大灵活易于扩展，并且完全开放源代码，面向大中型站点提供重量级企业网站建设解决方案。2年来，凭借Silence长期积累的丰富的Web开发及数据库经验和勇于创新追求完美的设计理念，使得...
程序猿（ProMonkey）是...用于记录项目中遇到的BUG及解决方案，方便日后出现问题或学习时查看，优秀程序员必备。 3、网址书签 快速添加、浏览自己所喜爱的网站，把它放在网络服务器上，可以随时随地不受限制地访问。
常见的 ASP.NET 2.0 转换问题和解决方案 Asp.Net2.0无刷新客户端回调 体验.net 2.0 的优雅（1） -- 异步WebService调用 ASP.NET 2.0页面框架的几点新功能 ASP.NET 2.0 中收集的小功能点 asp.net2.0中的webpart使用...
我们以精益求精的态度，追求卓越品质，为中小网站用户提供一套完美的迅速建站解决方案，我们在开发过程中无处不充分考虑用户的使用习惯，尽最大可能降低用户的使用门槛，让用户关注于内容维护本身，而不需要投入过多...
我们以精益求精的态度，追求卓越品质，为中小网站用户提供一套完美的迅速建站解决方案，我们在开发过程中无处不充分考虑用户的使用习惯，尽最大可能降低用户的使用门槛，让用户关注于内容维护本身，而不需要投入过多...
我们以精益求精的态度，追求卓越品质，为中小网站用户提供一套完美的迅速建站解决方案，我们在开发过程中无处不充分考虑用户的使用习惯，尽最大可能降低用户的使用门槛，让用户关注于内容维护本身，而不需要投入过多...
安全：道高一尺，强力保护您的爱站，不定时收集反馈BUG和漏洞，不定时的更新安全防护。让您的爱站每天接受体检，享受免费医疗的福利。 源码全部开源,支持自由修改发布。 全站完整无错，如无法架设可以去论坛看下...
document.writeln ('<dd>07月12日 修复搜索、导航和返回顶部BUG</dd>'); document.writeln ('<dd>06月26日 改进网页背景频道预览功能</dd>'); //document.writeln ('<dd>06月23日 改进返回顶部功能</dd>'); //...