本文章簡(jiǎn)單的介紹一下關(guān)于padding兼容ie6,ie8,firefox的做法，因?yàn)椴煌瑸g覽器對(duì)padding理解不一樣，所以在瀏覽時(shí)會(huì)有點(diǎn)差別 。
padding 簡(jiǎn)寫(xiě)屬性在一個(gè)聲明中設(shè)置所有內(nèi)邊距屬性 。
說(shuō)明
這個(gè)簡(jiǎn)寫(xiě)屬性設(shè)置元素所有內(nèi)邊距的寬度，或者設(shè)置各邊上內(nèi)邊距的寬度 。行內(nèi)非替換元素上設(shè)置的內(nèi)邊距不會(huì)影響行高計(jì)算；因此，如果一個(gè)元素既有內(nèi)邊距又有背景，從視覺(jué)上看可能會(huì)延伸到其他行，有可能還會(huì)與其他內(nèi)容重疊 。元素的背景會(huì)延伸穿過(guò)內(nèi)邊距 。不允許指定負(fù)邊距值 。
注釋：不允許使用負(fù)值 。
例子 1
padding:10px 5px 15px 20px;上內(nèi)邊距是 10px
右內(nèi)邊距是 5px
下內(nèi)邊距是 15px
左內(nèi)邊距是 20px
例子 2
padding:10px 5px 15px;上內(nèi)邊距是 10px
右內(nèi)邊距和左內(nèi)邊距是 5px
下內(nèi)邊距是 15px
例子 3
padding:10px 5px;上內(nèi)邊距和下內(nèi)邊距是 10px
右內(nèi)邊距和左內(nèi)邊距是 5px
例子 4
padding:10px;所有 4 個(gè)內(nèi)邊距都是 10px
設(shè)現(xiàn)在設(shè)置一個(gè)padding值，這個(gè)值在FF、IE8、IE6中都不一樣
首先考慮的是FF下的值
.test{padding:10px}
接著考慮IE8下的值
.test{padding:10px;*padding:9px}
最后考慮IE6下的值
.test{padding:10px;*padding:9px;_padding:8px}
這樣就可以了 。
做兼容性時(shí)，最先考慮FF、opera這些瀏覽器，最后考慮IE6 。
拿上例來(lái)說(shuō)，IE8、IE6都可識(shí)別*，但FF不能識(shí)別 。
所以拿*來(lái)做IE8的Hack，而_在FF和IE8中都不識(shí)別，只有IE6能識(shí)別，所以用_做IE6的Hack
推薦閱讀
- 含IE兼容解決方法 純CSS3實(shí)現(xiàn)圓角效果
- IE9的css hack使用示例
- 詳解IE瀏覽器的haslayout屬性及相關(guān)兼容性問(wèn)題解決
- IE6,IE7,IE8 css bug搜集及瀏覽器兼容性問(wèn)題解決方法匯總
- css IE8 兼容問(wèn)題的匯總
- 讓IE6支持css3，讓 IE7、IE8 都支持CSS3
- IE7和IE8的兼容性問(wèn)題
- IE7,6與Fireofx CSS對(duì)瀏覽器的兼容性性處理
- DIV+CSS相對(duì)IE6 IE7和IE8瀏覽器行為區(qū)別及兼容性問(wèn)題整理
- IE和Firefox CSS多瀏覽器兼容性技巧大全推薦