FF，chrome，ie主流浏览器兼容写法总结

现在主流浏览器就是火狐，谷歌，还有ie，这里总结一下我测试过的能很好的兼容各个浏览器的写法：
我们知道样式书写要从高版本的写到低版本，我一般是先写FF，谷歌这些浏览器的样式，再写兼容ie9-ie6的样式。现在ie10也出来，不过目前我还没有使用，市场份额也很小，应该和ie9差不多，这里暂时就不考虑了。

background：red；background：green\9；  前者火狐，谷歌等识别，后者ie各版本浏览器识别
background：red；background：yellow\0；*background：blue ； 前者火狐，谷歌等识别，中间ie8和ie9识别，后者ie7和ie6识别
*background：blue ；_background：#000; 前者ie7支持，后者ie6支持
background：gray！important；除了ie6，其他浏览器都支持。

如果给各个浏览器都写一个不一样的效果就是：

<html>
<head>
<title>无标题文档</title>
<style type="text/css">
.bg{width:100px;height:100px;background:red;background:green\0;*background:yellow;_background:blue;}
</style>
</head>
<body>
<div class="bg"></div>
</body>
</html>
 
========================================================
补充：今天偶然发现了一个更全的兼容写法，大家一起学习下：

.bg{background:#000;}          /*所有浏览器都识别，但是在此段中只有标准浏览器ff、chrome等是黑色*/
:root .bg{background:orange\0;}   /*这段只有ie9、ie10pp4为橙色，注意一定要加\0,否则准浏览器也会为橙色。因为：root不仅标准浏览器支持，ie里面ie9和ie10pp4也支持*/
.bg{background:green\0;}       /*ie8、ie9、ie10pp4都支持，但是此段中只有ie8会是绿色*/
.bg{*background:blue;}          /*ie6、ie7支持，此段中只有ie7是蓝色*/
.bg{_background:red;}           /*只有ie6支持*/

=========================================================

此处还有大漠更全的兼容hack写法：http://www.w3cplus.com/css/create-css-browers-hacks

浏览器内核分类：

1、ie浏览器----内核trident  ：使用trident渲染内核的浏览器还有360、遨游、搜狗、腾讯tt、世界之窗。。。

2、firefox浏览器--内核Gecko

3、chrome 和 safari---内核webkit

4、opera--内核presto　　

posted @ 2012-05-28 21:31  sheena的世界  阅读(495)  评论(0)    收藏  举报