码迷,mamicode.com
首页 > 其他好文 > 详细

常见几种浏览器兼容问题

时间:2015-07-26 23:51:21      阅读:178      评论:0      收藏:0      [点我收藏+]

标签:

最常见的几种兼容问题:
1.不同浏览器的标签默认的外补丁和内补丁不同


    在各个浏览器中,不加样式的情况下,各自的margin和padding差异较大。
    解决方法:在CSS中写*{margin:0px;padding:0px}

 2.子元素绑架父元素的margin-top

    在非IE浏览器中,如果父元素与子元素之间没有任何内容,在设置子元素的margin-top的时候,经常会出现父元素随着子元素一起动。
    解决办法可以有2个,一个是在父元素与子元素之间加入一个占位行,<div stye=‘height:0’>&nbsp;</div>;还有一个办法是设置父元素的内上边距值(padding-top).
   
3.块级标签float后要设置横向的margin值

    在IE6浏览器中,设置的横向margin值会加倍
    解决办法就是将块级标签设置为行级标签,display:inline.

4.设置有最小宽度、高度,最大宽度、高度时。
   
    在IE6浏览器中,不支持以上所说的属性。
    解决办法:div{width:200px;height:200px;_width:200px;_height:200px},该方法是利用了IE6的一个特征,当定义一个高度时,如果内容超过高度,元素会自动调整高度。

5.设置元素的透明度。

    在IE浏览器中支持filter:alpha(opacity=80);
    非IE浏览器支持opacity:0.8;

下面是IE678版本的hack:

     .header {_width:100px;}         /* IE6专用*/
    .header {*width:100px;}         /* IE6、IE7共用*/
    .header {width:100px\0;}        /* IE8*/
    .header {width:100px\9;}        /* IE6IE7IE8共用*/
    *+html .header{}        /*IE7*/ 

在IE6中!important的特殊用法:

    
ie6中,同一个大括号里对同一个样式属性定义,其中一个加!important 则!important标记是被忽略的。

    例:{background:red!important; background:green;}  。ie6下解释为背景色green,其它浏览器解释为背景色red;
   

 如果这同一个样式在不同大括号里定义,其中一个加important 则!important发挥正常用。 

 例:div{background:red!important} div{background:green}这时所有浏览器统一解释背景色red。
             


常见几种浏览器兼容问题

标签:

原文地址:http://www.cnblogs.com/ddzhao1989/p/4678843.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!