Google Chrome 的横空出世给用户带来了全新的体验,对前端开发人员来说,我们得多注意一个浏览器的兼容性。
但就测试的情况看,Google Chrome 浏览器对CSS3 选择器的支持在所有的浏览器里是最好的。
Google Chrome 浏览器是基于 Safari 正在使用的 Webkit 引擎,使用的版本是 AppleWebKit/525.13 。不过 Safari3.1 使用的是最新版本:AppleWebKit/525.18。
那 Google Chrome 浏览器对 CSS 选择器的支持又如何呢?感谢 Engage 公司的女前端开发工程师 Estelle 测试整理的《Google Chrome Browser CSS Selector Support》:
点击查看:Google Chrome Browser CSS Selector Support
由于Google Chrome 对CSS 3有良好的支持,所以可以利用CSS3 中的一些伪类来做专为Google Chrome的Hack
例如:
- body:nth-of-type(1) p{
- color: #333333;
- }
只有Google Chrome 和 Safari 3.0.I里面才会把文字显示为灰色。
顺便讲一下body:nth-of-type(1)的意思:
寻找每个元素的第一个子元素且这个子元素为body。当然你也可以用p:nth-of-type(3),意思是获取每个元素的第三个子元素且为P的标签。
当然,这样做有一定的风险,那就是向后的兼容性可能不太好。说不准哪一天,IE、FF就开始正式支持CSS3的所有标签了。
