CSS小记 - 选择器

一、选择器

基本选择器

        - 通配符选择器 - *

        - 标签选择器 - e

        - 类选择器 - .classNmae

        - id选择器 - #id

        - 复合选择器：

                - 后代选择器 - ul li

                - 子代选择器 - ul>li

                - 并集选择器 - p,a

                - 伪类选择器 - a:link(未被访问)/visited(已被访问)/hover(鼠标悬浮)/active(鼠标按下未复位);focus(获得光标)

css3新增选择器：

        - 属性选择器

                 - input[value(=10)]  ：含有value属性[value=10]的标签

                 - div[class^(开头)/$(结尾)/*(含有)="icon"]

        - 结构伪类选择器

                - first-child/last-child

                - nth-child(n)  ：n=-n+5表示前5个，n+5表示从第5个开始往后

                - fitst-of-type/last-of-type

                - nth-of-type(n)

        - 伪元素选择器  -  ::before/::after  ：伪元素选择器中必须有content值，无内容时可设为''

二、CSS三大特性

1.层叠性  -  就近原则(相同元素有不同样式值时)

2.继承性  -  子元素会继承父元素某些样式(颜色、文字相关)

3.优先级  -  选择器相同，按层叠性；选择器不同，按选择器权重

        权重大小排序：!important > 行内样式 > id(0 1 0 0) > 类、伪类(0 0 1 0) > 元素(0 0 0 1)

        复合选择器权重叠加：

                如.class ul li的权重为0 0 1 0 + 0 0 0 1 + 0 0 0 1 = 0 0 1 2

注意：

        1.继承后的权重为0

        2.a有默认的样式(浏览器设置的)