CSS选择器之符号

154 阅读1分钟
符号描述示例说明
紧接无符号相当于”并且“关系input.k-textbox{    ... }选出input并且包含k-textbox类的元素
, (逗号)选择器分格符, 选择多种元素h1, h2{    ... }选出h1 和 h2 的所有元素
. (圆点)类选择器.k-textbox{     ... }选出包含k-textbox类的元素
*(星号)所有元素*{    ... }选择所有的元素
# (井号)ID选择器#mem-id{   ... }选择 ID 为 mem-id 的元素
[ ]  (中括号)属性选择器h1[class='k-textbox']{    ... }选择h1并且包含k-textbox类的元素
 (空格)后代选择器#container h1{   ... }选择 ID 为 container 内的所有为h1后代元素
> (大于号)子元素选择器#container>h1{   ... }选择 ID 为 container 内的所有为h1的子元素(仅限子元素,孙的不计)
+ (加号)后面紧挨的兄弟选择器#mem-id+h1{   ... }选择 ID 为 mem-id 的后面 "紧挨" 的h1元素
~ (波浪线)兄弟元素选择器#mem-id~h1{    ... }选择ID 为 mem-id 的所有h1兄弟元素
: