一、Div+css通用兼容性代碼

你可以在css開頭加入 *html{padding:0px}

<style>
*html{padding:0px}
/* Clear Fix */
.clearfix:after {
content:”.”;
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix {
display:inline-block;
}
/* Hide from IE Mac */
.clearfix {display:block;}
/* End hide from IE Mac */
/* end of clearfix */
</style>

CSS+DIV 兼容性問題
瀏覽器兼容代碼：
瀏覽器

符號
IE6 IE7 IE8 FF
* √ √ × ×
!important × √ × √
_ √ × × ×
/9 × × √ ×
*html √ × × ×
*+html × √ × ×
說明：”√”代表能識別；” ×”代表不識別

1、案例一（常用）
如果各個瀏覽器的高度都不相同，代碼如下：

.warp{
Height:100px; /*IE6、IE7、IE8、FF識別*/
Height:110px/9; /*IE8識別*/
*height:120px!important; /*IE7 識別*/
*height:130px; /*IE6、IE7識別，但上一段代碼中!important的級別比*號的級別高，所以此段代碼只有IE6中才有效*/
}

2、案例二
如果各瀏覽器高度只有IE6和IE7中相同，而FF不同，代碼如下：

.warp{
Height:100px; /*IE6 、IE7、 IE8、FF識別*/
*height:120px; /*IE6、IE7識別*/
}

3、案例三
對各瀏覽器單獨寫不同代碼，如下：

.warp{ height:200px; } /* IE6 、IE7、 IE8、FF識別*/
.warp{ height:300px/9;} /*IE8識別*/
*html .warp{ hegith:210px; } /*IE6識別*/
*+ html .warp{ height:300px;} /*IE7識別*/

4、案例四
如果各瀏覽器高度相同只有IE6的不同，代碼如下：

.warp{
Height:100px; /* IE6 、IE7、 IE8、FF識別*/
_Height:120px; /*IE6識別*/
}

關于css部份技巧,div/IE6/IE7/IE8/FF
1.div的垂直居中問題
vertical-align:middle; 將行距增加到和整個DIV一樣高 line-height:200px; 然后插入文字，就垂直居中了。缺點是要控制內容不要換行
2. margin加倍的問題
設置為float的div在ie下設置的margin會加倍。這是一個ie6都存在的bug。解決方案是在這個div里面加上display:inline;
3.浮動ie產生的雙倍距離
#box{ float:left; width:100px; margin:0 0 0 100px; //這種情況之下IE會產生200px的距離 display:inline; //使浮動忽略}
這里細說一下block與inline兩個元素：block元素的特點是,總是在新行上開始,高度,寬度,行高,邊距都可以控制(塊元素);Inline元素的特點是,和其他元素在同一行上,不可控制(內嵌元素);
#box{ display:block; //可以為內嵌元素模擬為塊元素 display:inline; //實現同一行排列的效果 diplay:table;