google chrome 的CSS hack来了内容简介:浏览器多了也就这么个好处了 以下CSS语句目前只有Google Chrome和Safari 3.1可以正常解释。 关于这个hack起作用的解释如下: 每个网页只有一个body元素 将匹配页面内第一个也是唯一的一个body元素 只有Saf
浏览器多了也就这么个“好处”了……
以下CSS语句目前只有Google Chrome和Safari 3.1可以正常解释。
body:nth-of-type(1) p {
color: #333333;
}关于这个hack起作用的解释如下:
每个网页只有一个body元素
body:nth-of-type(1)将匹配页面内第一个也是唯一的一个body元素
只有Safari 3.1和google chrome支持:nth-of-type伪类
另附各浏览器对部分css的支持情况:
绿色 / √ 表示完全支持
橙色 / Δ 表示部分支持
红色 / Χ 表示不支持
| | Browsers | Pattern | Meaning | IE6 | IE7 | IE8 | FF | Op 9 | Sf | Op | FF | NS | CHROME | E:active E:hover E:focus | Matches E during certain user actions. Δ Δ √ √ √ √ √ √ √ √ Δ Δ √ √ √ √ √ √ √ √ Χ Χ √ √ √ √ √ √ √ √
E:before E:after | See Χ Χ Δ 3 √ √ √ √ √ √ √ Χ Χ Δ 3 √ √ √ √ √ √ √
| iPhn | Windows XP | Mac OSX | Selector | Saf 3.0 | Chrome | FF 3.0 | | √ √ √ √ √
#id | √ √ √ √ √ √ √ √ √ √ √ √ √ √ √
E F | √ √ √ √ √ √ √ 1. √ √ √ √ √ √ √
E > F | √ √ √ √ √ √ √ √ √ Χ √ √ √ √ √
E + F | √ √ √ √ √ √ √ √ √ Χ √ √ √ √ √
E[attr] | √ √ √ √ √ √ √ Δ Δ Χ √ √ √ √ Δ
E[attr=val] | Δ √ √ Δ Δ Δ Δ √ √ Χ √ Δ Δ Δ Δ
E[attr~=val] | Δ √ √ Δ Δ √ Δ Δ Δ Χ √ Δ √ Δ Δ
E[attr|=val] | Δ √ √ Δ Δ √ Δ Δ Δ Χ √ Δ √ Δ Δ
:first-child | Δ √ √ Δ Δ Δ Δ Δ Δ Χ √ Δ Δ Δ √
:link | √ √ √ √ √ Χ √ √ √ √ √ √ √ √ √
:visited | √ √ √ √ √ Χ √ √ √ √ √ √ √ √ √
:lang() | √ √ √ √ √ Δ √ Δ Χ Χ √ Χ Δ √ √
:before | √ √ √ √ √ √ √ √ Χ Χ √ √ √ √ Χ
::before | √ √ √ √ √ √ √ Χ Χ Χ √ √ √ √ Χ
:after | √ √ √ √ √ √ √ √ Χ Χ √ √ √ √ Χ
::after | √ √ √ √ √ √ √ Χ Χ Χ √ √ √ √ Χ
:first-letter | √ √ √ √ √ √ √ Χ √ √ √ √ √ √ Χ
::first-letter | √ √ √ √ √ √ √ Χ Χ √ √ √ √ √ Χ
:first-line | √ √ √ √ √ √ √ Χ √ √ √ √ √ √ Χ
::first-line | √ √ √ √ √ √ √ Χ Χ √ √ √ √ √ Χ
The following selectors are new to CSS3 (above were in previous versions) | E[attr^=val] | Δ √ √ Δ Δ Χ Δ Χ 2 Χ Χ √ Δ Χ Δ Δ
E[attr$=val] | Δ √ √ Δ Δ Χ Δ Χ 2 Χ Χ √ Δ Χ Δ Δ
E[attr*=val] | Δ √ √ Δ Δ √ Δ Χ 2 Χ Χ √ Δ √ Δ Δ
E ~ F | √ √ √ √ √ √ √ √ √ Χ √ Χ √ √ Χ
:root | √ √ √ √ √ Χ √ Χ Χ Χ √ √ Χ √ √
:last-child | Χ √ √ Δ Δ Χ Χ Χ Χ Χ √ Χ Χ Δ Δ
:only-child | Χ √ √ Δ Δ Χ Χ Χ Χ Χ √ Χ Χ Δ Χ
:nth-child() | Χ √ Χ Χ Χ Χ Χ Χ Χ Χ √ Χ Χ Χ Χ
:nth-last-child() | Χ √ Χ Χ Χ Χ Χ Χ Χ Χ √ Χ Χ Χ Χ
:first-of-type | Δ √ Χ Χ Χ Χ Δ Χ Χ Χ √ Χ Χ Χ Χ
:last-of-type | Χ √ Χ Χ Χ Χ Χ Χ Χ Χ √ Χ Χ Χ Χ
:only-of-type | Χ √ Χ Χ Χ Χ Χ Χ Χ Χ √ Χ Χ Χ Χ
:nth-of-type() | Χ √ Χ Χ Χ Χ Χ Χ Χ Χ √ Χ Χ Χ Χ
:nth-last-of-type() | Χ √ Χ Χ Χ Χ Χ Χ Χ Χ √ Χ Χ Χ Χ
:empty | Χ √ √ Δ Δ Χ Χ Χ Χ Χ √ Χ Χ Δ Δ
:not() | √ √ √ √ √ Χ √ Χ Χ Χ √ √ Χ √ √
:target | √ √ √ √ √ Χ √ Χ Χ Χ √ √ Χ √ √
:enabled | √ √ √ √ √ √ √ Χ Χ Χ √ Χ √ √ Χ
:disabled | √ √ √ √ √ √ √ Χ Χ Χ √ Χ √ √ Χ
:checked | √ √ √ √ √ √ √ Χ Χ Χ √ Χ √ √ √