css选择器

(1)类型选择器：根据html语言中的标记直接定义

语法：标签名称{属性：属性值;}

(2)class选择器：定义一类样式，可取多个名字

语法：.class{属性：属性值;}

(3)id选择器：只能取一个名字

语法：#id{属性：属性值;}

(4)伪类选择器：a:link 访问前超链接状态

a:visited 访问后超链接状态

e:hover 鼠标悬停显示的状态

e:active 鼠标按下显示的状态

(5)通配符：语法：*{声明}

说明：选中页面中所有元素

作用：清除页面上默认外边距和内填充

(6)群组选择器：语法：选择器1,选择器2,选择器3,....{声明;}

关系选择器：(7)包含选择器：语法：父元素 子元素{声明;}

                      (8)子代选择器：语法：父元素>子元素{声明;}

                      (9)兄弟选择器：语法：师傅~所有兄弟{声明;}

                      (10)相邻兄弟选择器：语法：师傅+大师兄{声明;}

(11)动态伪类选择器：e:focus点击后产生焦点

(12)目标伪类选择器：目标:target 子元素{声明;}/目标:target{声明;}

(13)结构伪类选择器：①e:frist-child 获取到e元素，且要满足为其父元素的第一个孩子；

                                   ②e:last-child 获取到e元素，且要满足为其父元素的最后一个孩子；

                                   ③e:nth-child{n} 获取到e元素，且要满足为其父元素的第n个孩子；

n的用法：even、2n偶数 odd、2n-1奇数 4n倍数 -n+5从1到5 -n+6:n+4从4到6 n+5从第5个开始往后的所有元素

                                   ④e:nth-last-child{n} 获取到e元素，且要满足为其父元素的倒数第n个孩子；

                                   ⑤ e:frist-of-type 获取到e元素，且要满足为其父元素的第一个该类型的孩子；

                                   ⑥e:last-of-type 获取到e元素，且要满足为其父元素的最后一个该类型的孩子；

                                   ⑦e:nth-of-type{n} 获r取到e元素，且要满足为其父元素的第n个该类型的孩子；

                                   ⑧e:nth-last-of-type{n} 获取到e元素，且要满足为其父元素的倒数第n个该类型的孩子；

                                   ⑨e:empty 获取到空的e元素(连空格都不能有)；

(14)属性选择器：①e:[attr] 拥有attr属性的e元素添加样式；

                            ②e:[attr="val"] 拥有attr的属性值为val的e元素添加样式；

                            ③e:[attr*="val"] attr的属性值包含val的e元素添加样式；

                            ④e:[attr^="val"] attr的属性值以val开头的e元素添加样式；

                            ⑤e:[attr$="val"] attr的属性值以val结尾的e元素添加样式；

(15)ui状态伪类选择器：①:enabled 可用的表单元素添加样式；

                                      ②:disabled 不可用的表单元素添加样式；

                                      ③:checked 被选中的表单元素添加样式；

                                      ④::selection 元素内容被选中时添加样式；(火狐需加前缀-moz-)

(16)伪元素选择器：①e::before 给e元素添加第一个子元素；

例：div::before{

                        content:"内容"；

                        display:block；

                        width:100px；

                        height:100px；

}

②e::after 给e元素添加最后一个子元素；

③e::first-letter 给e元素的第一个字添加样式；

④e::first-line 给e元素的第一行添加样式；