CSS 选择器

CSS 组合选择符

CSS 选择器规定了 CSS 规则会被应用到哪些元素上。

基本选择器

• 通用选择器（Universal selector）
  选择所有元素。（可选）可以将其限制为特定的名称空间或所有名称空间。 语法：* ns|* | 例子：* 将匹配文档的所有元素。

• 元素选择器（Type selector）
  按照给定的节点名称，选择所有匹配的元素。 语法：elementname 例子：input 匹配任何 元素。

• 类选择器（Class selector）
  按照给定的 class 属性的值，选择所有匹配的元素。 语法：.classname 例子：.index 匹配任何 class 属性中含有 “index” 类的元素。

• ID 选择器（ID selector）
  按照 id 属性选择一个与之匹配的元素。需要注意的是，一个文档中，每个 ID 属性都应当是唯一的。 语法：#idname 例子：#toc 匹配 ID 为 “toc” 的元素。

• 属性选择器（Attribute selector）
  按照给定的属性，选择所有匹配的元素。 语法：[attr] [attr=value] [attr~=value] [attr|=value] [attr^=value] [attr$=value] [attr*=value] 例子：[autoplay] 选择所有具有 autoplay 属性的元素（不论这个属性的值是什么）。

后代选取器

举例说明:

div p
{
background-color:red;
}

子元素选择器

举例说明:

div>p
{
background-color:red;
}

相邻兄弟选择器

举例说明:

div+p
{
background-color:red;
}

后续兄弟选择器

举例说明:

 
 





段落 1。 在 div 中。
段落 2。 在 div 中。


段落 3。不在 div 中。
段落 4。不在 div 中。