最近写项目时，发现使用兄弟选择器频繁，特此总结一下常用的兄弟选择器，我常用于如果A存在，则给B加特定样式，若A不存在，B是其它样式的情况，使用兄弟选择器很方便，供参考。
html:
<div>
<h2>标题部分</h2>
<p>111</p>
<p>222</p>
<p class="on">333</p>
</div>
- 兄弟选择器 “+”
表示某元素后相邻的兄弟元素，也就是紧挨着的，选中的是单个的
选中h2下面的第一个p ： h2+p{ }
- 兄弟选择器 “~”
表示某元素后所有同级的指定元素，选中的是所有的
选中h2下面的所有p ： h2~p{ }
- 如果想选中特定兄弟元素需要"~" 和 “.类名” 搭配使用文章来源：https://www.toymoban.com/news/detail-558437.html
选中h2下面的类名为on的元素 ： h2~.on{ }文章来源地址https://www.toymoban.com/news/detail-558437.html
到了这里，关于【CSS兄弟选择器】的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
