选择器1 + 选择器2 { 样式代码 }
其中,选择器1和选择器2分别表示的是要选择的兄弟元素。+表示的是选择器1之后的兄弟元素,也就是相邻的下一个兄弟元素。
举个例子:
/* 选择id为first的元素之后相邻的下一个div元素 */ #first + div { background-color: blue; }
上述例子表示的是选择id为first的元素之后相邻的下一个div元素,并将其背景颜色设置为蓝色。
需要注意的是,这种选择器只会选择一个元素,即选择器1之后的第一个兄弟元素,如果要选择多个兄弟元素,需要使用其他选择器。
另外,这种选择器还有一种比较特别的情况,即选择器1本身就是选择器2的兄弟元素,那么这种情况下也会应用样式。例如:
/* 选择id为first的元素之后相邻的下一个p元素 */ #first + p { color: red; }这是相邻的下一个p元素
这个p元素不会被应用样式
上述例子中,选择id为first的元素之后相邻的下一个元素是一个p元素,所以被应用了样式。而第二个p元素不会被应用样式,因为它不是第一个相邻的p元素。