CSS3学习笔记-选择器

CSS3 选择器

1.1属性选择器

E[attr ^="value"] 指定属性名，找到以value开头的属性值

E[attr$="value"] 指定属性名，找到以value结尾的属性值

E[attr*="value"] 指定属性名，找到包含value开头的属性值

1.2为类选择器

1.2.1 用户界面相关的

E：enabled{}：元素被激活的时候触发，比如输入框获取焦点
E：disabled{}：元素被禁用的时候触发，比如输入框不可获取到焦点
E：checked{}：当元素被选中的时候触发，比如radio或checkbox元素的选中
E：selection{}：选中的时候触发，比如一大坨文字被选中的时候，给选中的文字设置字体

注意：::selection
选择器匹配被用户选取的选取是部分。

只能向 ::selection
选择器应用少量 CSS
属性：color、background、cursor
以及 outline。



1.2.2 结构性伪类

：root，在HTML文档中，就是HTML元素
Body的高度到底是啥？？？当我们没有对HTML元素设置背景颜色的时候，HTML会自动 读取 body的背景颜色。
E：empty：当一个元素没有内容（没有子元素）的时候触发。
E：nth-child（4）{}：所有元素的父元素的第index孩子，孩子的编号号是从1开始，同时编号的顺序不管
什么类型的元素标号依次递增。
E：nth-of-type（index）{}：所有元素的父元素的第index孩子，还在的编号根据一类型的元素进行编号，如果子元素有多种元素（div、h3、p），那么就有多组编号
E：first-of-type{} == nth-of-type（index）{}
E：list-of-type == E：nth-of-type（最后一个）{}