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瀏覽器的版本從而給定樣式或者判斷條件
