关于css兼容性问题与实践方案

标识区别

区别IE6,IE7,IE8,FF。

IE都能识别* ; 标准浏览器(如FF)不能识别*；
IE6能识别*，但不能识别 !important; IE6在样式前面加_
IE7能识别*，也能识别!important;
IE8能识别\ 9 例如：background:red \9;
firefox不能识别*，但能识别!important;

（1）IE6和firefox的区别：

/* 火狐浏览器的背景颜色是橙色,而IE浏览器的背景色是蓝色 */
background:orange;*background:blue;

（2）IE6和IE7的区别：

/* IE7的背景颜色是绿色,IE6的背景颜色是蓝色 */
background:green !important;background:blue;

（3）IE7和FF的区别：

/* 火狐浏览器的背景颜色是橙色,而IE7的背景颜色是绿色 */
background:orange; *background:green;

（4）FF、IE7、IE6的区别：

/* 火狐浏览器的的背景橙色,IE7浏览器的背景颜色是绿色,而IE6浏览器的颜色是蓝色. */
background:orange;
*background:green !important;
*background:blue;

实践方案

（1）开发平台的选择
在 Firefox(火狐)上编写css, 同时兼容其他浏览器。
这样做肯定会比在 IE 做好再到别的浏览器兼容来得容易, 因为 IE 对老标准支持还是很不错的, 而 IE 的一些特有功能人家却不支持. 所以推荐以 Firefox 结合 Firebug 扩展作为平台。

扫描二维码关注公众号，回复： 6757467 查看本文章

（2）CSS Hack 的顺序
使用 Firefox 作为平台, 只要代码写得够标准, 其实要 Hack 的地方不会很多的。
IE 以外的浏览器几乎都不会有问题, 所以可以暂时忽略。

顺序如下：Firefox -> IE6 -> IE7 -> 其他

（3）Hack 的方法
说到方法有两种：
一种是在不同文件中处理, 另一种则是在同一个文件中处理。
其实作用是相同的, 只是方式不一样而已。

同一文件中处理就是一个属性想办法兼容你想兼容的浏览器。

为什么同一文件中可以处理还要写在多个文件里面针对不同的浏览器?这是为了欺骗 W3C的验证工具,其实只需要两个文件,一个是针对所有浏览器的,一个只为 IE服务.将所有符合 W3C的代码写到一个里面去,而一些 IE中必须的,又不能通过 W3C验证的代码 (如: cursor:hand;)放到另一个文件中,再用下面的方法导入。

<!--[if IE]>
	<link href="兼容IE的css样式.css" rel="stylesheet">
<![endif]-->

这段代码只有 IE 可以识别，也就是说只有在IE浏览器才引入，这就是在不同文件中处理。
其实，只要代码足够规范与健壮，再者随着web逐渐流行的原因，只存在两种浏览器：浏览器与 IE 。
我觉得，以后浏览器兼容性不再是头痛的问题。
如果你对这段代码不了解，请访问这篇文章学习。