1、CSS兄弟相邻选择器加号
相邻兄弟选择器使用了加号（+），即相邻兄弟结合符（Adjacent sibling combinator）。
注释：与子结合符一样，相邻兄弟结合符旁边可以有空白符。
CSS兄弟相邻选择器加号，举例说明
HTML代码
<p>这里是第一个P标签</p><p>这里是第二个P标签</p><h2 class = 'h2'>标题H2</h2><p>这里是第一个P标签</p><p>这里是第二个P标签</p><p>这里是第三个P标签</p><p>这里是第四个P标签</p>CSS代码
.h2 + p{color: red
}
2、CSS兄弟选择器~(匹配选择器)
'~'匹配所有在指定元素之后的同级某个元素
举例说明一个，CSS的匹配选择器
HTML代码
<p>这里是第一个P标签</p><p>这里是第二个P标签</p><h2 class = 'h2'>标题H2</h2><p>这里是第一个P标签</p><p>这里是第二个P标签</p><p>这里是第三个P标签</p><p>这里是第四个P标签</p>CSS代码
.h2 ~ p{color: red
}
3、总结：
CSS中的兄弟选择符号‘~’，可以选择指定元素后的，同级的相同的所有元素。比如上面的示例，所以h2标签后的P标签全部被选择，并加入了样式
通过这两个例子，可以发现虽然这两个选择器都表示兄弟选择器，但是‘+’选择器则表示某元素后相邻的兄弟元素，也就是紧挨着的，是单个的。而‘~’选择器则表示某元素后所有同级的指定元素，强调所有的。
其他选择器可参考
us usa的缩写 ch china缩写，代表的是不同地区的默认语言设置选择带有以 "en" 开头的 lang 属性值的每个 <p>元素，并设置其样式：
<p lang="en">Ceci est un paragraphe.</p>
p:lang(en)
{
background:yellow
}
lang属于伪类，该值必须是整个单词，即可是单独的，比如 lang="en"，也可后跟连接符，比如 lang="en-us"
：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param>以及 <script>
BEM除了是一种新的命令方式之外，我个人认为他还是提出了模块与模块，组件与组件，模块与组件之间的管理方式。如何通过一种命名方式更好的管理和维护他们。仅除命名的方式出发，很多同学会接受不了，认为命名繁琐，增加了文件体积，另外编写样式，写选择器麻烦，从而增加了工作量。如果仅从这两方面来说他不好，或许有点过激。
从一种思想上来看，BEM还是有很多值得大家去思考的，特别是用于维护项目，或者跨团队的开发当中，他的好处会明显见长。
任何一样东西能生存，都有其自己的优势，当然万物有得就必有失。这是相互的，至于我们前端人员，或者一个团队如何取舍，还是需要从自已或团队力量出发，有利用之，无利就不用了
