为了实现浏览器兼，主要有以下几种方式：
1、给<html>标记添加包含User Agent的class属性”
这种方式得到的<html>标记可能会是这样的：<html class="ua-wk ua-wk535">
2、条件样式表
<!--[if IE 6]><link href="ie6.css" />< ![endif]-->这种注释的方式只有IE浏览器支持，其他浏览器只会把它当做html注释，不起任何作用。一般使用Javascript或者服务器端程序判断User Agent。
好处是：HTML和CSS代码可以通过验证；可以很轻松的管理项目中的目标浏览器，并使得CSS补丁文件保持独立自由。更重要的是它帮助我们优化了 CSS样式表，保证了主要样式表的干净，这对于大型网站来说就很重要了。
缺点是：这些注释需要放在HTML页面中，而不是放在CSS中。这样，当你不需要这些东西，或者有所更改的时候，就需要维护很多的地方。
注：yahoo的内部编码最佳做法并不建议使用有条件的样式表。它会增加额外的平均1或2个HTTP下载请求
3、css hack
http://blog.moocss.com/code-snippets/html-css-code-snippets/1130.html
http://www.cnblogs.com/wiky/archive/2010/01/07/Browser-CSS-Hacks-assembles.html
国内解决兼容性问题一般是用CSS Hacks
#test{
background-color: black;/* Firefox, Opera, IE8 */
[;background-color: green;]/* Safari, Chrome */
*background-color: blue;/* IE7 */
_background-color: red;/* IE6 */
}
属性hacks混写时要注意顺序
background-color:blue; 各个浏览器都认识，这里给firefox用；
background-color:red\9;\9所有的ie浏览器可识别；
background-color:yellow\0; \0 是留给ie8的
+background-color:pink; + ie7定了；
_background-color:orange; _专门留给神奇的ie6；
:root #test { background-color:purple\9; } :root是给ie9的，
@media all and (min-width:0px){ #test {background-color:black\0;} } 这个是老是跟ie抢着认\0的神奇的opera，必须加个\0,不然firefox，chrome，safari也都认识。。。
@media screen and (-webkit-min-device-pixel-ratio:0){ #test {background-color:gray;} }最后这个是浏览器新贵chrome和safari的。
280
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
