網(wǎng)站開發(fā)人員，在開發(fā)過(guò)程中，總是會(huì)遇到許多莫名其妙的BUG，其中，以IE6不兼容的問題據(jù)多。我們有什么辦法能夠讓寫的網(wǎng)站樣式全兼容呢？這就需要很多css技巧了，下面是淮安互聯(lián)網(wǎng)站建設(shè)公司總結(jié)的一些css技巧，相信對(duì)大家能夠有點(diǎn)幫助。

需要圖片在層中是垂直居中

    當(dāng)需要圖片在層中是垂直居中，可以圖片定義vertical-align: middle;，再在圖片左側(cè)加入，定義樣式display: inline-block; height: 100%; vertical-align: middle; 就是兼容的了。

子元素浮動(dòng),父元素不能自動(dòng)適應(yīng)高度

    FF IE7下可以在父元素定義overflow: auto; IE6加入 zoom: 1; 這個(gè)觸發(fā)IE的.layout。或在浮動(dòng)元素后加入在浮動(dòng)層后面加入。

IE下圖片產(chǎn)生的間隙

    父元素直接包含，這個(gè)圖片下方會(huì)和父元素邊緣產(chǎn)生間隙。 解絕方法：1.在源代碼中讓和在同一行，因?yàn)槟莻€(gè)間隙是由換行符產(chǎn)生的。2.給添加樣式 display:block;

IE下高度低于10像素時(shí)問題

    塊元素最小高度為10px，當(dāng)高度定義小于10px時(shí)，仍為10px; 解決方法：為此塊元素添加樣式 overflow:hidden; 或font-size: 0;

IE，F(xiàn)F下列表的li為浮動(dòng)，則列表后面的元素不能換行的問題

    解決方法：為這個(gè)ul定義合適的高或給包含這個(gè)ul 的父div定義合適的高。或加上

IE,FF下子元素的上下外邊界問題(不定義寬高)

    子元素的上下外邊界和父元素上下外邊界疊加，并且顯示在父元素外面。解決方法：在父元素增加 overflow:hidden;或給父元素增加邊框或內(nèi)邊距。

IE,FF下子元素的上下外邊界問題(定義寬度)

    IE6：子元素的上邊距和父元素的上內(nèi)邊距疊加。FF：子元素上邊距顯示在父元素上方。解決方法：在父元素增加 overflow:hidden;或給父元素增加邊框或內(nèi)邊距。

IE,FF下子元素的上下外邊界問題(定義高度)

    IE6：子元素上邊距顯示正常。FF：子元素的上邊距和父元素的上內(nèi)邊距相加。解決方法：1、給父元素定義內(nèi)邊距。2、父元素設(shè)置邊框，子元素定義上外邊距。3、父元素定義overflow: hidden;，子元素定義上外邊距。

IE,FF高度自適應(yīng)問題（最小高度）

    在IE6下子元素的高度能夠撐開父元素，但FF，IE7下不可以。解決辦法：父元素定義min-height:高度值; height:auto !important; height:高度值; （要注意先后順序不能錯(cuò)）

IE,FF高度自適應(yīng)問題（最大高度，最小寬度，最大寬度）

    最大高度，max-height: 180px; _height: expression( this.scrollHeight > 180 ? "180px" : "auto" ); 后面兩條是解決IE6問題。

    最小寬度，min-width: 900px; _width: expression(this.width < 600 ? 600: true);

    最大寬度，max-width: 300px; _width: expression(this.width > 600 ? 600: true);

子元素負(fù)邊距問題

    IE6：超出父元素的部分會(huì)被父元素覆蓋。FF：分兩種情況當(dāng)父元素有邊框或內(nèi)邊距時(shí)，超出父元素的部分會(huì)覆蓋父元素；沒有時(shí)父元素?fù)碛胸?fù)邊距。解決方法：子元素定義相對(duì)定位。同時(shí)IE下子容器如果包含屬性position:relative，則父容器失效(IE bug)，所以也需要設(shè)置父容器position:relative解決，IE6需要zoom:1來(lái)觸發(fā)haslayout

IE6詭異的奇數(shù)BUG

    當(dāng)父元素相對(duì)定位，子元素絕對(duì)定位時(shí)，倘若父元素的高或?qū)挼臄?shù)值是奇數(shù)，那么IE6下絕對(duì)位置會(huì)出錯(cuò)。解決方法： 數(shù)值改成偶數(shù)，IE6是大俠，只要服從它。

               轉(zhuǎn)載自淮安浪強(qiáng)網(wǎng)絡(luò)科技有限公司  http://haiis.com