我們在做頁面時不可避免的會碰到瀏覽器安全色問題，特別是IE6，那麼要如何相容所有瀏覽器呢，答案是CSS HACK。
下面的代碼是我自己整理的一些常用css hack，希望能夠協助到大家。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> <title>css hack</title> <style type="text/css"> .demo{width:100px;height:100px;border:5px solid orange;} .demo1{ background:black; /* for all */ } .demo2{ background:green\9; /* for ie */ } .demo3{ background:yellow\0; /* for ie8 */ } .demo4{ *background:blue; /* for ie7,ie6 */ } .demo5{ _background:red; /* for ie6 */ } </style> </head> <body> <div class="demo demo1"></div><br/> <div class="demo demo2"></div><br/> <div class="demo demo3"></div><br/> <div class="demo demo4"></div><br/> <div class="demo demo5"></div> </body> </html>
還有一些css hack我沒用羅列出來，譬如chrome的，opera的等等。對於這些通常情況下我們是用不到的。
測試的瀏覽器：IE6，IE7，IE8，IE9，Firefox，Google，Safari
PS：最好的csser就是在不用css hack的情況下完成所有瀏覽器的相容。本人也推薦盡量避免使用css hack，不過碰到蛋疼的瀏覽器（IE6，IE7）也是沒有辦法，往往要糾結那1,2像素，否則我們的測試不讓過，項目上不了線- -
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
