(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元素的第一行添加样式;