日本免费全黄少妇一区二区三区-高清无码一区二区三区四区-欧美中文字幕日韩在线观看-国产福利诱惑在线网站-国产中文字幕一区在线-亚洲欧美精品日韩一区-久久国产精品国产精品国产-国产精久久久久久一区二区三区-欧美亚洲国产精品久久久久

  1. 首頁 > 云知道 > >

IE8的css hack9 使用說明

云知道

首先感謝丸子提供的這個(gè)IE8的css hack；
關(guān)注過IE8的css hack的人相信大家都在使用這個(gè)hack，就是9的css hack：
.test{ color:#000000; /* FF,OP支持 */ color:#0000FF9; /* 所有IE瀏覽器(ie6 )支持 ；但是IE8不能識別*和_的css hack；所以我們可以這樣寫hack */ [color:#000000;color:#00FF00; /* SF,CH支持 */ *color:#FFFF00; /* IE7支持 */ _color:#FF0000; /* IE6支持 */ }包括我自己也是使用這種的，這是我前段時(shí)間整理的《主流瀏覽器的一些CSS hack》 。
很多人再研究color:#0000FF9;中的為什么IE6-IE8支持9寫法，和它的原理，我只是個(gè)工程師，不是科學(xué)家，我不懂為什么和它的真正原理，真的！很慚愧！
昨天在某個(gè)群里也看到部分前端工程師或網(wǎng)頁重構(gòu)師勢利的一面，同樣的一個(gè)解決方案，大公司有名的前端工程師或網(wǎng)頁重構(gòu)師寫的東西都追捧，而小公司沒名氣的前端工程師或網(wǎng)頁重構(gòu)師寫的解決方案卻被反問：css有這種寫法嗎？看來你連最基本的css的幾個(gè)屬性和屬性值都沒搞懂；就算你解決了問題你寫的css也是不規(guī)范的，就是規(guī)范你跟我講講你解決方案的原理；同樣的一個(gè)解決方案，大公司有名的前端工程師或網(wǎng)頁重構(gòu)師寫的這些反問質(zhì)疑就全都沒了，拼命的去研究他這個(gè)解決方案，呵呵，我覺得那些人很可笑 。還有很多人問問題只有得到大公司有名的前端工程師或網(wǎng)頁重構(gòu)師的肯定回答后才放心而又開心的走了，甚至不留一句謝謝 。當(dāng)然沒人（包括我）否認(rèn)大公司有名的前端工程師或網(wǎng)頁重構(gòu)師在業(yè)界的影響力，他們?yōu)榍岸撕椭貥?gòu)業(yè)界做的貢獻(xiàn)大家都是看得到的，只是覺得做人（特別是我們做技術(shù)的）不能太勢利，多一點(diǎn)技術(shù)共享和探討，多一點(diǎn)感激，學(xué)習(xí)成長才是最重要的 。我承認(rèn)我以前經(jīng)常罵人，罵人家SB，內(nèi)參國王說的對，罵人家SB就等于罵自己SB，我以前是很SB 。不想探討就看著唄，罵人是不對的！
扯遠(yuǎn)了，回到IE8的CSS hack，講講color:#0000FF9：
color:#0000FF9的hack支持IE6-IE8（其他版本沒有測試），但是IE8不能識別*和_的css hack，所以我們可以使用
color:#0000FF9; ;/*ie6,ie7,ie8*/
*color:#FFFF00;/*ie7*/
_color:#FF0000;/*ie6*/
來區(qū)分IE的各個(gè)版本 。
說明：在標(biāo)準(zhǔn)模式中

-減號是IE6專有的hack
9 IE6/IE7/IE8/IE9/IE10都生效
IE8/IE9/IE10都生效，是IE8/9/10的hack
9 只對IE9/IE10生效，是IE9/10的hack
測試代碼
script type=text/javascript//alert(document.compatMode);/scriptstyle type=text/cssbody:nth-of-type(1) .iehack{color: #F00;/* 對Windows IE9/Firefox 7 /Opera 10 /所有Chrome/Safari的CSS hack，選擇器也適用幾乎全部Mobile/Linux/Mac browser*/}.demo1,.demo2,.demo3,.demo4{width:100px;height:100px;}.hack{/*demo1 *//*demo1 注意順序，否則IE6/7下可能無法正確顯示，導(dǎo)致結(jié)果顯示為白色背景*/background-color:red; /* All browsers */background-color:blue !important;/* All browsers but IE6 */*background-color:black; /* IE6, IE7 */background-color:yellow;/* IE6, IE7*/background-color:gray9; /* IE6, IE7, IE8, IE9, IE10 */background-color:purple; /* IE8, IE9, IE10 */background-color:orange9;/*IE9, IE10*/_background-color:green; /* Only works in IE6 */* background-color:pink; /*WARNING: Only works in IE7 ? Is it right? */}/*可以通過javascript檢測IE10，然后給IE10的html標(biāo)簽加上class=ie10 這個(gè)類 */.ie10 #hack{color:red; /* Only works in IE10 */}/*demo2*/.iehack{/*該demo實(shí)例是用于區(qū)分標(biāo)準(zhǔn)模式下ie6~ie9和Firefox/Chrome的hack，注意順序 IE6顯示為：綠色，IE7顯示為：黑色，IE8顯示為：紅色，IE9顯示為：藍(lán)色，F(xiàn)irefox/Chrome顯示為：橘色，（本例IE10效果同IE9,Opera最新版效果同IE8） */background-color:orange;/* all - for Firefox/Chrome */background-color:red;/* ie 8/9/10/Opera - for ie8/ie10/Opera */background-color:blue9;/* ie 9/10 - for ie9/10 */*background-color:black;/* ie 6/7 - for ie7 */_background-color:green;/* ie 6 - for ie6 */}/*demo3 實(shí)例是用于區(qū)分標(biāo)準(zhǔn)模式下ie6~ie9和Firefox/Chrome的hack，注意順序 IE6顯示為：紅色，IE7顯示為：藍(lán)色，IE8顯示為：綠色，IE9顯示為：粉色，F(xiàn)irefox/Chrome顯示為：橘色，（本例IE10效果同IE9，Opera最新版效果也同IE9為粉色）*/.element {background-color:orange;/* all IE/FF/CH/OP*/}.element {*background-color: blue;/* IE6 7, doesn’t work in IE8/9 as IE7 */}.element {_background-color: red;/* IE6 */}.element {background-color: green; /* IE8 9 10*/}:root .element { background-color:pink; }/* IE9 10 *//*demo4*//*該實(shí)例是用于區(qū)分標(biāo)準(zhǔn)模式下ie6~ie10和Opera/Firefox/Chrome的hack，本例特別要注意順序 IE6顯示為：橘色，IE7顯示為：粉色，IE8顯示為：黃色，IE9顯示為：紫色，IE10顯示為：綠色，F(xiàn)irefox顯示為：藍(lán)色，Opera顯示為：黑色，Safari/Chrome顯示為：灰色，*/.hacktest{background-color:blue;/* 都識別，此處針對firefox */background-color:red9;/*all ie*/background-color:yellow;/*for IE8/IE9/10 最新版opera也認(rèn)識*/background-color:pink;/*for ie6/7*/_background-color:orange;/*for ie6*/}@media screen and (min-width:0){.hacktest {background-color:black;}/*opera*/}@media screen and (min-width:0) {.hacktest { background-color:purple9; }/*for IE9/IE10PS:國外有些習(xí)慣常寫作，根本沒考慮Opera也認(rèn)識的實(shí)際 */}@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {.hacktest { background-color:green; } /* for IE10此寫法可以適配到高對比度和默認(rèn)模式，故可覆蓋所有ie10的模式 */}@media screen and (-webkit-min-device-pixel-ratio:0){ .hacktest {background-color:gray;} }/*for Chrome/Safari*//* #963棕色 :root is for IE9/IE10, 優(yōu)先級高于@media, 慎用！如果二者合用，必要時(shí)在@media樣式加入 !important 才能區(qū)分IE9和IE10 *//* :root .hacktest { background-color:#9639; }*//style更多的介紹可以參考這篇文章：http://www.jb51.net/css/493362.html

推薦閱讀