主頁 > 知識庫 > CSS Hack大全-教你如何區(qū)分出IE6-IE10、FireFox、Chrome、Opera

CSS Hack大全-教你如何區(qū)分出IE6-IE10、FireFox、Chrome、Opera

熱門標簽:南通電銷外呼系統(tǒng)軟件 上海400電話辦理到易號網(wǎng) 成都企業(yè)外呼系統(tǒng) 申請400電話移動 洛陽防封卡外呼系統(tǒng)廠家 山東電銷機器人軟件 廣州防封電銷機器人廠家 常州電話外呼系統(tǒng)招商 智能語音電銷機器人客戶端

現(xiàn)在的瀏覽器IE6-IE10、Firefox、Chrome、Opera、Safari。。。數(shù)量眾多,可謂百家爭鳴,對用戶來說有了很多的可選擇型,不過這可就苦了Web前端開發(fā)人員了。
今天把一些常用的CSS Hack整理了一下,包括常用的IE hack以及火狐、Chrome、Opera瀏覽器的Hack,并把這些CSS Hack綜合的一起,寫了一個小的瀏覽器測試器。如圖所示:

下面就來看一下代碼吧:

html部分:

復制代碼 代碼如下:

div class="content">
    div class="test">/div>
    div class="txt">
        p>IE6下背景顏色:span class="ie6" style="background-color: #ccc;">#ccc/span>/p>
        p>IE7下背景顏色:span class="ie7" style="background-color: #666;">#666/span>/p>
        p>IE8下背景顏色:span class="ie8" style="background-color: #06f;">#06f/span>/p>
        p>IE9下背景顏色:span class="ie9" style="background-color: #f00;">#f00/span>/p>
        p>IE10下背景顏色:span class="ie10" style="background-color: #0ff;">#0ff/span>/p>
        p>webkit,Safari,Chrome下背景顏色:span class="webkit-safari-gg" style="background-color: #ff0;">#ff0/span>/p>
        p>FireFox下背景顏色:span class="firefox" style="background-color: #f0f;">#f0f/span>/p>
        p>Opera下背景顏色:span class="opera" style="background-color: #0f0;">#0f0/span>/p>
    /div>
/div>

CSS部分,此部分就只貼Hack部分的代碼吧,布局的就不貼了:

復制代碼 代碼如下:

.content .test {
    width: 200px;
    height: 200px;
    background: #f60; /*all*/
    background: #06f9; /*IE*/
    *background: #666; /*IE6,7*/
    _background: #ccc; /*IE6*/
}

/* webkit and opera */
@media all and (min-width:0){
    .content .test {
        background: #0f0;
    }
}

/* webkit */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .content .test {
        background: #ff0;
    }
}

/*FireFox*/
@-moz-document url-prefix() {
    .content .test {
        background: #f0f;
    }
}

/*IE9+*/
@media all and (min-width:0) {
    .content .test{
        background: #f009;
        }
}

/*IE10+*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .content .test {
        background: #0ff;
    }
}

css-hack-ms-moz-webkit-o-Jb51.net.rar

您可能感興趣的文章:
  • CSS Hack 匯總快查
  • 指定網(wǎng)頁的doctype解決CSS Hacking方法總結
  • Chrome的hack寫法以及CSS的支持程度圖示
  • css ie6 ie7 ff的CSS hack使用技巧
  • CSS Hack 匯總速查手冊瀏覽器兼容必會
  • 區(qū)分IE6,IE7,firefox的CSS hack
  • CSS Hack收集匯總
  • CSS hack用法案例詳解

標簽:混顯 貴州 鶴壁 萊蕪 廣安 滄州 邵陽 賀州

巨人網(wǎng)絡通訊聲明:本文標題《CSS Hack大全-教你如何區(qū)分出IE6-IE10、FireFox、Chrome、Opera》,本文關鍵詞  CSS,Hack,大全,教你,如何區(qū),;如發(fā)現(xiàn)本文內(nèi)容存在版權問題,煩請?zhí)峁┫嚓P信息告之我們,我們將及時溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡,涉及言論、版權與本站無關。
  • 相關文章
  • 下面列出與本文章《CSS Hack大全-教你如何區(qū)分出IE6-IE10、FireFox、Chrome、Opera》相關的同類信息!
  • 本頁收集關于CSS Hack大全-教你如何區(qū)分出IE6-IE10、FireFox、Chrome、Opera的相關信息資訊供網(wǎng)民參考!
  • 推薦文章