使用 media實現IE hack的方法

文章簡介：

眾所周知，有些時候為了實現ie下的某些效果與現代瀏覽器一致，我們不得不使用一些hack手段來實現目的。比如說使用「\0」，「\」和「\9」來僅讓ie某些版本識別，而對於現代瀏覽器來說，他會直接無視這些**。今天我想為大家介紹的是使用@media實現ie hack的方法.

隨著responsive設計的流行，medial queries可算是越來越讓人觀注了。他可以讓web前端工程實現不同裝置下的樣式選擇，讓站點在不同的裝置中實現不同的效果。這個早前在w3cplus已經介紹過，如果你還沒有接觸，不仿點選這裡詳細閱讀。今天在看blog時發現乙個其他的使用方法，就是利用@media來做一些ie下的特殊效果。

眾所周知，有些時候為了實現ie下的某些效果與現代瀏覽器一致，我們不得不使用一些hack手段來實現目的。比如說使用「\0」，「\」和「\9」來僅讓ie某些版本識別，而對於現代瀏覽器來說，他會直接無視這些**。今天我想為大家介紹的是使用@media實現ie hack的方法：

僅ie6和ie7識別

@media screen\9  }

@media \0screen\,screen\9  }

@media \0screen  }

@media screen\0  }

@media screen and (min-width:0\0)  }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none)

打個比方，如果你的body中設定了乙個紅色的背景，而想讓不同版本ie變成別的顏色，那麼我們就可以這麼操作

body   /* ie6、ie7變成綠色 */ @media all\9  }  /* ie8變成藍色 */ @media \0screen  } /*ie9和ie10變成黃色*/ @media screen and (min-width:0\0)  }

使用 media實現IE hack的方法

使用 media實現ie hack的方法 僅ie6和ie7識別 media screen 9 僅ie6和ie7 ie8識別 media 0screen screen 9 僅ie8識別 media 0screen 僅ie8 10識別 media screen 0 僅ie9和ie10識別 media s...

media 實現網頁自適應

media 其實就是判斷螢幕多大的解析度 然後選用什麼 css樣式 media screen and min width 413px 例子就是這樣的 min 相當於 這個符號 max 相當於 這個符號 多個 判斷 區間 用 and相連 media screen and min width 413px...

響應式布局的實現 media

好久沒寫響應式頁面了，這個是之前公司的乙個專案。今天開啟了設計文件，按照設計文件的要求大體做了一下。當然裡面是存在細節問題的。如圖 基礎講解見我另一篇部落格 這個效果如何實現呢？當然首選的就是 查詢 media 了 查詢應當怎麼寫呢？css樣式分為 內聯式css樣式 嵌入式css樣式 外部式css樣...