摘要：下的兼容問題處理背景透明，圓角，和支持部分選擇器例如支持的語(yǔ)義化標(biāo)簽，媒體查詢等。在頁(yè)面頭部?jī)?yōu)先加載需要的插件，因?yàn)椴糠植寮枰蕾囁孕枰钕燃虞d。注意順序，插件優(yōu)先添加。這個(gè)路徑是相對(duì)的路徑。

ie8下的兼容問題處理：背景透明，css3圓角，css3和jquery支持部分css3選擇器（例如：nth-child）,支持html5的語(yǔ)義化標(biāo)簽，媒體查詢@media等。

在html頁(yè)面頭部優(yōu)先加載ie8需要的插件，因?yàn)椴糠植寮枰蕾噅query,所以jquery需要最先加載。然后用IE的條件注釋添加需要的腳本

如果是其他的樣式.css就添加在里面的全局global.css后面

如果是其他的插件和邏輯js就添加在 的上方。注意順序，插件js優(yōu)先添加。

只要如上添加插件js就可以在ie8下使用css3和jquery css3選擇器nth-child,html5語(yǔ)義化標(biāo)簽，如：section articel，媒體查詢@media等。

圓角border-radius

直接將pie.htc文件放在項(xiàng)目結(jié)構(gòu)里，如圖1的紅色塊1

如圖1的紅色塊2 calcPrice.html添加的樣式如圖1的紅色塊3calcPrice.css里面的樣式用到圓角或陰影，需在后面添加behavior: url(../../../public/css/PIE.htc);

關(guān)鍵來(lái)了，behavior后面的url路徑不是css相對(duì)pie，這個(gè)和我們平時(shí)的background-image使用不一樣。這個(gè)路徑是html相對(duì)的pie路徑。你也可以理解成calcPrice.html這個(gè)頁(yè)面添加圖1紅色塊1上面的global.css 的路徑就是behavior: url(../../../public/css/PIE.htc)的正確路徑了，因?yàn)閜ie文件和global.css 文件在同一個(gè)目錄下。

盒子陰影：

     box-shadow: 1px 1px 1px #dedede;
    -moz-box-shadow: 1px 1px 1px #dedede;
    -webkit-box-shadow: 1px 1px 1px #dedede;
    behavior: url(../../../public/css/PIE.htc);

圓角

    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    behavior: url(../../../public/css/PIE.htc);

ie8背景圖片沒生效？

例子： background: url(../images/carInfo.png)no-repeat 0 0;
以上這樣的路徑是正確的，在chrom下完全沒問題，為什么到了ie8，背景圖就顯示不了？

解決辦法很簡(jiǎn)單
 background: url(../images/carInfo.png)  no-repeat 0 0;
在url()后面加上兩個(gè)空格就可以了。
      

嬌氣的ie8，按照上面使用的pie.htc的圓角和盒子陰影，發(fā)現(xiàn)元素隱藏不見了！?。?！
解決辦法：在需要用圓角和陰影的元素樣式上加上position:relative; 就可以了。

ie8背景透明opacity

在ie8下背景透明而透明層上沒文字或圖片內(nèi)容的時(shí)候，可以在opacity=0;下一行直接添加 filter:Alpha(opacity=0);

但是透明的背景上有內(nèi)容的時(shí)候，在ie8只上面加了filter:Alpha，是不是覺得就像你大冬天在浴室里帶著眼鏡洗熱水澡看到的情景。。。。。眼前一片朦朧哇~~~

  假設(shè)我們需要設(shè)置下面的div背景透明而文字不透明
  
        
    
        
      
我是文字，我不想被透明啊~
   
      
 
  
 

/*遮蓋層公共樣式*/
    .coverModal{
        display: none;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        margin-left: -6%;
        z-index: 9999;
   }
.coverBg {
    height:100%;
    background-color: rgba(0,0,0,0.5);
    /* IE9、標(biāo)準(zhǔn)瀏覽器、IE6和部分IE7內(nèi)核的瀏覽器(如QQ瀏覽器)會(huì)讀懂 */
}

.coverBg .coverCon{
    color: #FFFFFF;
}
@media