CSS 选择器
2023-04-18 11:41:28 +0000 UTC
Art
CSS 选择器
CSS 选择器规定了 CSS 规则会被应用到哪些元素上。
备注: 暂时没有能够选择 父元素、父元素的同级元素,或 父元素的同级元素的子元素 的选择器或者组合器。
基本选择器
选择所有元素。(可选)可以将其限制为特定的名称空间或所有名称空间。
语法:
*ns|**|*例子:
*将匹配文档的所有元素。按照给定的节点名称,选择所有匹配的元素。
语法:
elementname例子:
input匹配任何<input>元素。按照给定的
class属性的值,选择所有匹配的元素。语法:
.classname例子:
.index匹配任何class属性中含有 "index" 类的元素。按照
id属性选择一个与之匹配的元素。需要注意的是,一个文档中,每个 ID 属性都应当是唯一的。语法:
#idname例子:
#toc匹配 ID 为 "toc" 的元素。按照给定的属性,选择所有匹配的元素。
语法:
[attr][attr=value][attr~=value][attr|=value][attr^=value][attr$=value][attr*=value]例子:
[autoplay]选择所有具有autoplay属性的元素(不论这个属性的值是什么)。
分组选择器(Grouping selector)
组合器(Combinator)
“ ”(空格)组合器选择前一个元素的后代节点。
语法:
A B>组合器选择前一个元素的直接子代的节点。语法:
A > B~组合器选择兄弟元素,也就是说,后一个节点在前一个节点后面的任意位置,并且共享同一个父节点。语法:
A ~ B+组合器选择相邻元素,即后一个元素紧跟在前一个之后,并且共享同一个父节点。语法:
A + B||组合器选择属于某个表格行的节点。语法:
A || B