常见兼容问题性问题有哪些

经常使用浏览器兼容问题一：不一样浏览器的标签默认的外补丁和内补丁不一样
 
问题症状：随便写几个标签，不加样式控制的状况下，各自的margin 和padding差别较大。
 
碰到频率:100%
 
解决方案：CSS里    *{margin:0;padding:0;}
 
备注：这个是最多见的也是最易解决的一个浏览器兼容性问题，几乎全部的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0。

经常使用浏览器兼容问题二：块属性标签float后，又有横行的margin状况下，在IE6显示margin比设置的大
 
问题症状:常见症状是IE6中后面的一块被顶到下一行
 
碰到频率：90%（稍微复杂点的页面都会碰到，float布局最多见的浏览器兼容问题）
 
解决方案：在float的标签样式控制中加入 display:inline;将其转化为行内属性
 
备注：咱们最经常使用的就是div+CSS布局了，而div就是一个典型的块属性标签，横向布局的时候咱们一般都是用div float实现的，横向的间距设置若是用margin实现，这就是一个必然会碰到的兼容性问题。

经常使用浏览器兼容问题三：透明度的兼容CSS设置
 
作兼容页面的方法是：每写一小段代码（布局中的一行或者一块）咱们都要在不一样的浏览器中看是否兼容，固然熟练到必定的程度就没这么麻烦了。建议常常会碰到兼容性问题的新手使用。不少兼容性问题都是由于浏览器对标签的默认属性解析不一样形成的，只要咱们稍加设置都能轻松地解决这些兼容问题。若是咱们熟悉标签的默认属性的话，就能很好的理解为何会出现兼容问题以及怎么去解决这些兼容问题。
 
/* CSS hack*/ 我不多使用hacker的，多是我的习惯吧，我不喜欢写的代码IE不兼容，而后用hack来解决。不过hacker仍是很是好用的。使用hacker我能够把浏览器分为3类：IE6 ；IE7和遨游；其余（IE8 chrome ff safari opera等）
 
◆IE6认识的hacker 是下划线_ 和星号 *
 
◆IE7 遨游认识的hacker是星号 *
 
好比这样一个CSS设置：
 
height:300px;*height:200px;_height:100px; IE6浏览器在读到height:300px的时候会认为高时300px；继续往下读，他也认识*heihgt， 因此当IE6读到*height:200px的时候会覆盖掉前一条的相冲突设置，认为高度是200px。继续往下读，IE6还认识_height,因此他又会覆盖掉200px高的设置，把高度设置为100px；
 
IE7和遨游也是同样的从高度300px的设置往下读。当它们读到*height200px的时候就停下了，由于它们不认识_height。因此它们会把高度解析为200px，剩下的浏览器只认识第一个height:300px;因此他们会把高度解析为300px。由于优先级相同且想冲突的属性设置后一个会覆盖掉前一个，因此书写的次序是很重要的。

经常使用浏览器兼容问题四：Ie6下，不识别最大宽、高度和最小宽高度，意即min-width/height和 Max-width/height在ie6中没效果，
解决方法：(1)：.abc{border:1px blue solid;width:200px;height:200px;}
                          html>body .abc{width:auto;height:auto;min-width:200px;min-height:200px;}
        (2)：.abc{width:200px;height:200px;_width:200px;_height:200px;}（由于ie6有一个特征，当定义一个高度时，若是内容超太高度，元素会自动调整高度。）

经常使用浏览器兼容问题五：

像素问题：ie6下，当浮动元素与流动元素并列显示时，他们之间会存在三像素问题。
   解决方法：用hack技术， 例如：全部浏览器通用 height:100px; 
                                                  ie6专用_height:100px;
                                                  ie7专用*+height:100px; 
                                                  ie6/ie7共用*height:100px;

经常使用浏览器兼容问题六：

ie6 不支持 fixed 
复制代码
/*对于非IE6能够这样写*/
#top{  
    position:fixed;  
    bottom:0;  
    right:20px;  
}  

/*可是IE6是不支持fixed定位的，须要另外重写*/
#top{  
    position:fixed;  
    _position:absolute;  
    top:0;  
    right:20px;  
    _bottom:auto;  
    _top:expression(eval(document.documentElement.scrollTop));
}  

/*使用hack使IE6实现该效果，但这个东东会闪烁，须要如下代码*/
*html{  
    background-image:url(about:blank);  
    background-attachment:fixed;  
}  

/*使固定在顶部*/
#top{  
    _position:absolute;  
    _bottom:auto;  
    _top:expression(eval(document.documentElement.scrollTop));  
}  

/*固定在底部*/
#top{  
    _position:absolute;  
    _bottom:auto;  
    _top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop)||0)-(parseInt(this.currentStyle.marginBottom)||0)));  
}  
/*垂直居中*/
#top{
    position:fixed;
    top:50%;
    margin-top:-50px;
    _position:absolute;
    _top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight/2)); 
}