如何練就優(yōu)秀的項(xiàng)目體驗(yàn)
創(chuàng)意、流程、執(zhí)行缺一不可
CREATIVITY, PROCESS, PERFORM INDISPENSABLE
什么是css hack
2016-09-06

      hack,顧名思義黑客。不過我在這里說的當(dāng)然不是這個(gè)意思啦~那么什么是css hack呢?

     以下引自百度文庫的定義

簡單地講,css hack指各版本及各品牌瀏覽器之間對(duì)CSS解釋后出現(xiàn)網(wǎng)頁內(nèi)容的誤差(比如我們常說錯(cuò)位)的處理。由于各瀏覽器的內(nèi)核不同,所以會(huì)造成一些誤差就像JS一樣,一個(gè)JS網(wǎng)頁特效,在微軟IE6、IE7、IE8瀏覽器有效果,但可能在火狐(Mozilla Firefox)谷歌瀏覽器無效,這樣就叫做JS hack ,所以我們對(duì)于CSS來說他們來解決各瀏覽器對(duì)CSS解釋不同所采取的區(qū)別不同瀏覽器制作不同的CSS樣式的設(shè)置來解決這些問題就叫作CSS Hack。


總的來說就是因?yàn)椴煌瑸g覽器和版本對(duì)樣式解析出現(xiàn)差異導(dǎo)致制作網(wǎng)頁的時(shí)候明顯不一樣,嚴(yán)重的會(huì)整個(gè)頁面錯(cuò)位哦??!

css hack 是通過在css樣式中加入一些特殊的符號(hào),讓不同的瀏覽器識(shí)別不同的符號(hào)(什么樣的瀏覽器識(shí)別什么樣的符號(hào)是有標(biāo)準(zhǔn)的,css hack就是讓你記住這個(gè)標(biāo)準(zhǔn)),以達(dá)到應(yīng)用不同的css樣式的目的。

下面是兼容各大主流瀏覽器的css hack匯總(最全的):

.element{
color:#000;             /*w3c標(biāo)準(zhǔn)*/
[;color:#f00;];         /*Webkit(chrome和safari)*/
color:#666\9;           /*IE8*/
*color:#999;            /*IE7*/
_color:#333;            /*IE6*/
}
:root .element{color:#0f0\9;}  /*IE9*/
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (
-webkit-min-device-pixel-ratio:0) { .element{color:#336699;}}  /*opera*/
@-moz-document url-prefix(){ .element{color:#f1f1f1;}} /*Firefox*/

建議:在實(shí)際開發(fā)中如果不是很清楚可以先寫布局代碼,寫一個(gè)階段再用瀏覽器測試工具(推薦IETEST)測試哥哥版本瀏覽器的布局效果,如有問題再針對(duì)問題單獨(dú)調(diào)試解決

CONTACT US
  • 服務(wù)熱線:18664767192
  • 廣州技術(shù)總部:廣州市天河區(qū)天河北路179號(hào)尚層國際21層
  • 郵箱:admin@bangju.com
掃一掃加客服微信