| 网页制作Webjx文章简介：30个最常用css选择器解析. |
5. X
a { color: red; }
ul { margin-left: 0; }
标签选择器。使用标签选择器作用于作用域范围内的所有对应标签。优先级仅仅比*高。
兼容浏览器：IE6+、Firefox、Chrome、Safari、Opera
6. X:visited和X:link
a:link { color: red; }
a:visted { color: purple; }
使用:link伪类作用于未点击过的链接标签。:hover伪类作用于点击过的链接。
兼容浏览器：IE7+、Firefox、Chrome、Safari、Opera
7. X+Y
ul + p {
color: red;
}
相邻选择器，上述代码中就会匹配在ul后面的第一个p，将段落内的文字颜色设置为红色。(只匹配第一个元素)
兼容浏览器：IE7+、Firefox、Chrome、Safari、Opera
8. X>Y
div#container > ul {
border: 1px solid black;
}
<div id="container">
<ul>
<li> List Item
<ul>
<li> Child </li>
</ul>
</li>
<li> List Item </li>
<li> List Item </li>
<li> List Item </li>
</ul>
</div>
子选择器。与后代选择器X Y不同的是，子选择器只对X下的直接子级Y起作用。在上面的css和html例子中，div#container>ul仅对container中最近一级的ul起作用。从理论上来讲X > Y是值得提倡选择器，可惜IE6不支持。
兼容浏览器：IE7+、Firefox、Chrome、Safari、Opera
9. X ~ Y
ul ~ p {
color: red;
}
相邻选择器，与前面提到的X+Y不同的是，X~Y匹配与X相同级别的所有Y元素，而X+Y只匹配第一个。
兼容浏览器：IE7+、Firefox、Chrome、Safari、Opera