CSS hack

CSS hack是為了根據(jù)不同瀏覽器或者同一瀏覽器的兼容或者某些特性引起的頁(yè)面展示效果不達(dá)人愿而使用的一種技術(shù)
大致分為三類:
1、選擇器前綴法: 例如 IE6能識(shí)別div .div{},IE7能識(shí)別+div .div{}或者*:first-child+div .div{}。
2、屬性前綴法:IE6能識(shí)別""和" * ",IE7能識(shí)別" * ",但不能識(shí)別"",IE6~IE10都認(rèn)識(shí)"\9",但firefo對(duì)前述三個(gè)都不認(rèn)識(shí)
3、IE條件注釋法:,針對(duì)IE6及以下版本: 。這類Hack既可以調(diào)節(jié)樣式,也可以執(zhí)行內(nèi)部的判斷語(yǔ)句。

選擇器前綴法

*html *前綴只對(duì)IE6生效
*+html *+前綴只對(duì)IE7生效
@media screen\9{...}只對(duì)IE6/7生效
@media \0screen {body { background: red; }}只對(duì)IE8有效
@media \0screen,screen\9{body { background: blue; }}只對(duì)IE6/7/8有效
@media screen\0 {body { background: green; }} 只對(duì)IE8/9/10有效
@media screen and (min-width:0\0) {body { background: gray; }} 只對(duì)IE9/10有效
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {body { background: orange; }} 只對(duì)IE10有效

屬性前綴法

編號(hào) hack 例子 適用瀏覽器
1 * *color IE6 及以下版本 IE7
2 + +color IE6 及以下版本 IE7
3 _ _color IE6 及以下版本
4 - -color IE6 及以下版本
5 # #color IE6-IE10
6 \0 color:#000\0; IE8和IE10
7 \9\0 color:#000\9\0; IE9和IE10
8 \9 color:#000\9; IE6 - IE10

IE條件注釋法

主要是針對(duì)ie瀏覽器的,通過判斷IE瀏覽器的版本從而給定樣式或者判斷條件


img.png
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容