基本选择器1.id名称2.class类3.*通配符4.label选择器复合选择器intersectionselector1.div.box{/*labeldiv类名为box*/}2..box.box1{/*有一个box类名，还有一个.box1类名*/}Unionselector.box,box1{/*标签是boxt和box1的标签*/}关系选择器1.>子选择器Sonischild2.Space后代选择器元素下面的所有元素都是后代3.~兄弟选择器同父元素，即兄弟选择下一个兄弟4.+相邻兄弟选择器选择所有下面的兄弟姐妹（自己除外）风格优先金字塔顶部权重最高，会覆盖向下的元素属性权重为256伪类选择器状态类：1.:link/*不访问链接*/2。:visited/*访问过的链接*/3.:hover/*usermouseover*/这个伪类表示鼠标箭头在被选元素上的状态，可以用在任何元素上4。:active/*activatelink*/该伪类表示表单元素、链接等元素的激活状态。时间;对于a元素，也是鼠标左键按下且未抬起时）5.:checked该伪类表示表单元素的选中状态，可用于单选按钮、复选框等元素6.:focus该伪类表示当用户通过键盘的“tab”键点击、触摸或选择表单元素、链接等元素时触发。7.:focus-within一个元素获得焦点，它的后代获得焦点。元素状态聚焦，父元素监控8.:not()选择器结构类：1.:nth-child()这个CSS伪类首先找到伪类之前选择器选择的元素的所有兄弟元素，然后按位置顺序从1排序，选择第(n)个元素。2.:nth-last-child()这个和:nth-child基本一样，只是它从末尾倒数而不是从头开始3.:nth-of-type()这个选择器匹配那些在位置在被选元素的同一个兄弟节点中伪类匹配前括号中的元素:nth-of-type()4.:nth-last-of-type()与:nth-基本相同of-type相同，只是它从末尾倒数，而不是从头倒数5。:first-child选择父元素中第一个（并且必须是第一个）出现的
- 6。:first-of-type选择父元素中第一次出现的
- ，不管它在兄弟元素中的位置代码：.boxli:nth-child(2)img{left:220px;}.boxli:nth-of-type(1)img{左：220px；}属性类1.attr该选择器在伪类之前选择器选中的元素中选择包含attr属性的元素（attr为属性名）2.attr=val该选择器只选择attr属性为的所有元素赋值val。（attr是属性名，val是属性值）3.attr~=val这个选择器选择attr属性中所有值为val的元素。（attr为属性名，val为属性值，~表示包含）4.attr^=val选取attr属性值以val开头的元素（包括val）（^表示以xx开头）5.attr$=val选取attr属性值以val结尾的元素（包括val）（$表示xx结尾）6.attr*=val选取attr属性值包含字符val的元素（子串是字符串的一部分，例如"cat"是字符串“caterpillar”的子字符串）伪元素1。::before创建一个伪元素，它将成为匹配的所选元素2的第一个子元素。::after创建一个伪元素，它将成为最后一个所选元素的子元素。伪元素的内容样式用于在元素的::before和::after伪元素中插入内容。这个虚拟元素默认是一个内联元素。伪元素的目的是在现有的被选元素内部添加第一个子元素和最后一个子元素。目的是为了增加显示的内容，所以伪元素必须有一个内容样式来激活伪元素，即使内容样式的内容是一个空的“”，也必须添加。一旦不写内容样式，伪元素就失效了。指定外部资源（例如图像）。如果无法显示资源或图像，将被忽略或显示一些占位符（例如无图像标志）。伪元素的优点：伪元素不会影响结构选择器（伪元素不能被其他选择器选中！！！）伪元素不会被搜索引擎收录，不会影响网页的SEO