CSS参考手册
选择 | Selectors
相邻兄弟选择器 | Adjacent sibling selectors
相邻兄弟组合因子(+
)分隔两个选择器。仅当第二个元素直接跟随第一个元素,且两者都是相同父element
的孩子节点时,它匹配该第二个元素。
/* Paragraphs that come immediately after any image */
img + p {
font-style: bold;
}
语法
former_element + target_element { style properties }
实例
CSS
li:first-of-type + li {
color: red;
}
HTML
<ul>
<li>One</li>
<li>Two!</li>
<li>Three</li>
</ul>
结果
规范
Specification |
Status |
Comment |
---|---|---|
Selectors Level 4The definition of 'next-sibling combinator' in that specification. |
Working Draft |
Renames it the "next-sibling" combinator. |
Selectors Level 3The definition of 'Adjacent sibling combinator' in that specification. |
Recommendation |
|
CSS Level 2 (Revision 1)The definition of 'Adjacent sibling selectors' in that specification. |
Recommendation |
Initial definition. |
浏览器兼容性
Feature |
Chrome |
Edge |
Firefox (Gecko) |
Internet Explorer |
Opera |
Safari |
---|---|---|---|---|---|---|
Basic support |
(Yes) |
(Yes) |
(Yes) |
7.01 |
(Yes) |
(Yes) |
Feature |
Android |
Edge |
Firefox Mobile (Gecko) |
IE Mobile |
Opera Mobile |
Safari Mobile |
---|---|---|---|---|---|---|
Basic support |
2.1 |
(Yes) |
(Yes) |
? |
(Yes) |
(Yes) |
选择 | Selectors相关
层叠样式表( Cascading Style Sheets )是一种用来表现 HTML 或 XML 等文件样式的计算机语言。CSS 不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。