做网站时常见的浏览器兼容问题大全

常见浏览器兼容问题一：

  块属性标签float后，又有横行的margin情况下，在ie6显示时，后面的一块会被顶到下一行，尤其出现在稍微复杂点的页面。这是div+css使用div float布局模式通过margin实现横向间距最常见出现兼容问题。

  遇到这种情况可以在float的标签样式控制中加入 display:inline;将其转化为行内属性。

常见浏览器兼容问题二：IE与宽度和高度的问题

   IE不认得min-这个定义，但实际上它把正常的width和height当作有min的情况来使。这样问题就大了，如果只用宽度和高度，正常的浏览器里这两个值就不会变，如果只用min-width和min-height的话，IE下面根本等于没有设置宽度和高度。 比如要设置背景图片，这个宽度是比较重要的。要解决这个问题，可以这样： #box{ width: 80px; height: 35px;}html>body #box{ width: auto; height: auto; min-width: 80px; min-height: 35px;} 

常见浏览器兼容问题三：

   设置小圆角背景的标签里，设置较小高度标签（一般小于10px），在ie6，ie7，遨游中高度超出自己设置高度。由于ie6、7和遨游里这个标签的高度不受控制，要把超出高度的标签设置overflow:hidden;或者设置行高line-height 小于你设置的高度。而ie8以后的浏览器都会给标签一个最小默认的行高的高度。一般不会出现这种问题。

常见浏览器兼容问题四：IE,FF的默认值问题

   或许你一直在抱怨为什么要专门为IE和FF写不同的CSS，为什么IE这样让人头疼，然后一边写css，一边咒骂那个可恶的M$ IE.其实对于css的标准支持方面，IE并没有我们想象的那么可恶，关键在于IE和FF的默认值不一样而已，掌握了这个技巧，你会发现写出兼容FF和 IE的css并不是那么困难，或许对于简单的css，你完全可以不用”!important”这个东西了。 我们都知道，浏览器在显示网页的时候，都会根据网页的 css样式表来决定如何显示，但是我们在样式表中未必会将所有的元素都进行了具体的描述，当然也没有必要那么做，所以对于那些没有描述的属性，浏览器将采用内置默认的方式来进行显示，譬如文字，如果你没有在css中指定颜色，那么浏览器将采用黑色或者系统颜色来显示，div或者其他元素的背景，如果在 css中没有被指定，浏览器则将其设置为白色或者透明，等等其他未定义的样式均如此。所以有很多东西出现FF和IE显示不一样的根本原因在于它们的默认显示不一样，而这个默认样式该如何显示我知道在w3中有没有对应的标准来进行规定，因此对于这点也就别去怪罪IE了。

常见浏览器兼容问题五：

   行内属性标签，设置display:block后采用float布局，又有横行的margin的情况，ie6里的间距比超过设置的间距。

   行内属性标签，为了设置宽高，我们需要设置display:block;(除了input标签比较特殊)。在用float布局并有横向的margin后，在ie6下，他就具有了块属性float后的横向margin的bug。不过因为它本身就是行内属性标签，所以我们再加上display:inline的话，它的高宽就不可设了。这时候我们还需要在display:inline后面加入display:talbe。

常见浏览器兼容问题六：javascript兼容性问题

   这个也是个非常麻烦的问题来源，主要的问题依然来自于IE浏览器系列和其他浏览器的差别：IE调用的是系统组件，而其他浏览器调用的自己内建的组件，这就造成了你必须针对不同的浏览器调用不同的组件，最典型的方面莫过于ajax。但其他浏览器之间的问题也一样不少，我见过的问题就有：RGB值的表示方式的不同，offsetleft取出的值不同，还有前篇文章提到的readystate的解释不同等问题。javascript的问题有相当一部分可以靠一些脚本插件如jquery来改善，但要想做完善，需要针对不同浏览器进行详细的测试。