我们在做页面时不可避免的会碰到浏览器兼容问题，特别是 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-9，firefox，chrome
PS：最好的 csser 就是在不用 css hack 的情况下完成所有浏览器的兼容。本人也推荐尽量避免使用 css hack，不过碰到蛋疼的浏览器（ie6）也是没有办法，往往要纠结那 1，2 像素，否则我们的测试不让过，项目上不了线- -