css 选择器种类 10种 + 权重

1、类选择器            .class名{ }

2、id选择器            #id名{ }

3、元素选择器           元素名{ }                  eg:p{}  h1{}  div{}   

4、属性选择器           选择器名[ 属性名 ]{ }          eg:a[href] { color: red }  带有 href 属性的a标签颜色设置为红色

5、伪类选择器                              eg:div:hover{ }  鼠标悬停在div上时

6、通配符选择器           *{ }                   eg: *{font-size: 16px}  文档中所有元素的字体大小为16px

7、群组选择器            选择器1 , 选择器2 , 选择器N{ }      eg:.box1,#box2,p{}  class为box1 id为box2 p标签

8、后代选择器(包含选择器)     选择器1 选择器2 选择器N{ }       eg:h1 em{ }   h1 元素中所有后代的 em元素

9、子元素选择器           父元素>子元素              eg:h1 > strong  h1 元素中为直接后代的 strong 元素(直接父类为h1,不能是其他元素里包裹的 strong)

10、相邻兄弟选择器         选择器1 + 选择器2          eg: h1 + p{ }  选择紧跟在h1下面的p标签   注:两个选择器必须有共同的父元素,选择器2紧接着选择器1

 


 

 

10000     ! important      // 无条件优先

1000         内联样式     style=" "

100      id选择器

10      类选择器、伪类、属性

1        标签、伪元素

0        通配符、子、相邻

无      继承

              浏览器默认

 

先从高等级开始比较,

高等级相同时,再比较低等级

都相同时,后者优先,即样式覆盖

 

css 选择器种类 10种 + 权重

上一篇:asp.net mvc如何在单元测试中使用session


下一篇:实现discuz 论坛安装