css选择器比较少见，用的也很少，因此在这里可能不会深入探讨，相邻选择器以SEO精学网多年使用经验，整体上还是是不错的，相邻选择器的特点是它们是拥有相同的父元素，连接符号用“+”号，比如h+p，一般情况下，使用相邻选择器的目的是在拥有相同的父级多个相同兄弟，如果想要控制某一个同胞兄弟的样式变化，那么这个相邻兄弟选择器是有很大的帮助的，值得注意的是“+”号两边都可以有无限的空格，让我们来看一个典型的例子。
<div>
<ul>
<li>css相邻兄弟</li>
<li> css相邻兄弟</li>
<li> css相邻兄弟</li>
<li> css相邻兄弟</li>
<li> css相邻兄弟</li>
<li> css相邻兄弟</li>
<ul>
</div>
<style>
比如我要控制最后一个变成红色：li+li+ li+li+ li+li {
color:red;
}
</style>
当然CSS选择器还可以结合其它选择器进行使用，比如子元素选择器、元素选择器等等。
二 CSS伪类选择器
伪类主要应用于某些选择器添加特殊的效果，如果是比较有经验的一些开发者，可能就会注意到，伪类一般用于鼠标事件，导航使用的比较多的，常用的伪类有4种，但在这里为了让大家了解更多的伪类，我们一一讲解。
常见伪类有:active、:focus、:hover、:link、:visited、：first-child、:lang，值得注意的是:active、:hover、:link、:visited、这四个经常与A标签使用，达到了不错的效果， 如a:link、a:visited、a:hover、a:active，示例如下：
a:link {color: red} /* 未访问的链接 */
a:visited {color: red} /* 已访问的链接 */
a:hover {color: red} /* 鼠标移动到链接上 */
a:active {color: red} /* 选定的链接 */
这四个位置不要颠倒了，否则效果失效， a:hover 必须被置于 a:link 和 a:visited 之后，才是有效的。a:active 必须被置于 a:hover 之后，才是有效的。
:first-child 伪类：注意这个伪类不是选择子元素，而是本身选择器与之使用，改变选择器中的内容或者选择同胞兄弟中的第一个或者第一个里面所有相同标签，还有必须声明 <!DOCTYPE>，这样 :first-child 才能在 IE 中生效。
<ul>
<li>aaaa</li>
<li>bbbb<strong>bbb</strong></li>
<li>ccccc</li>
</ul>
<style>
li:first-child {text-transform:uppercase;};
</style>
a这时候会变成A。当然使用 :first-child更多的是提高代码运行效率。
:lang伪类讲解：:lang 伪类是向带有指定 lang 属性的元素添加样式，示例如下：
<p lang="no">:lang 伪类</p>
p:lang(no)
{
color:#00e;
}
</style>
字体会变成蓝色，注意使用方法。除以上选择器及伪类，还有其他比较重要的选择器，这就涉及CSS3的内容，有时间会给大家讲（:first-of-type、:last-of-type、:only-of-type、:only-child、:nth-child(n)、:nth-last-child(n)、:nth-of-type(n)、:nth-last-of-type(n)、:last-child等）
静学网 , 版权所有丨如未注明 , 均为原创丨转载请注明[SEO优化]CSSs相邻兄弟选择器和伪类的使用及详解（五）！
顶一下
(1)
踩一下
(0)
