当前位置：首页 → 问答吧 → DIV+CSS浏览器的兼容性问题总结（实战得出的结论）

DIV+CSS浏览器的兼容性问题总结（实战得出的结论）

时间：2010-08-18

来源：互联网

大家好，这是小弟第一次发帖，请大家多多支持。
DIV+CSS浏览器兼容的问题困扰了我很久，从开始做网站就一直遇到问题，但幸好遇到了那么多问题，才总结出了一些方法，现在对于兼容性的问题基本不用担心了，以下是我在做网站过程中总结出来的针对IE6.0IE7.0,IE8.0和FIREFOX的兼容性问题，分享出来大家一起研究，希望能对大家有一点帮助。

一、关于ie8.0
我现在在公司的所以网站都是用一句代码来解决的：“<meta http-equiv="x-ua-compatible" content="ie=7"/>“，这句代码放在<head></head>中间，可以使在IE8.0中看到的效果和IE7.0中完全一样，所以只要页面在IE7.0下正常，IE8.0就没问题了.
二、关于火狐
火狐对CSS的要求比较严格，但是基本上出现页面错位等问题，都是由于浮动引起的，所以我现在做页面的时候，在每个外层的DIV中都加入float：left;这句话，大家不要小看这个做法，真的非常管用，现在我调试网站的时候，发现火狐有错位的现象就找每天外层的DIV，加入左浮动，基本解决了所以的问题，这个真的非常管用！还有就是个别情况下在火狐里的位置或是间距不正确，这个时候我就用专门针对火狐的代码来写，例如：
#aa{ width: 500px; }    //这个是火狐的
* html #aa { width: 400px; }   //这个是ie6.0的
*+html #aa{ width: 300px; } //这个是ie8.0的
总之关于火狐我遇到的问题主要都是出在浮动上面，遇到问题都用添加外出div的左浮动来解决的，我也做了快两年网站了，所以这个方法真的有用。
三、关于ie6.0
当外层DIV设置了浮动属性，内层div也设置的浮动属性，并设置了边距属性，例如：
.aa{
float:left;
}
.bb{
float:left;
margin-left:10px;
}
<div class="aa">
     <div class="bb">dddd</div>
</div>
这个的结构在ie6.0里面bb里面的内容距离aa读取出来的就是20px，就会产生双边距，所以每次直接在bb中再加入一句：display:inline; 这样就可以解决这个问题了，先写这明天整理一下再写，以上只是我的一些实践的经验，并不一定适用所以的情况，请大家理解

作者: 灰太狼来了发布时间: 2010-08-18

很好的文章，值得学习

作者: djlinks 发布时间: 2010-08-19

很好的帖子，支持一下啊

作者: 304429404 发布时间: 2010-08-19