此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。

View in English Always switch to English

接续兄弟组合器

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2015年7月⁩.

接续兄弟选择器+)介于两个选择器之间,当第二个元素紧跟在第一个元素之后,并且两个元素都是属于同一个父元素的子元素,则第二个元素将被选中。

css
/* 图片后面紧跟着的段落将被选中 */
img + p {
  font-weight: bold;
}

语法

css
former_element + target_element { style properties }

示例

CSS

css
li:first-of-type + li {
  color: red;
}

HTML

html
<ul>
  <li>One</li>
  <li>Two!</li>
  <li>Three</li>
</ul>

结果

规范

Specification
Selectors Level 4
# adjacent-sibling-combinators

浏览器兼容性

参见