选择器选择器简单选择器1. ID选择器2. 元素选择器3. 类选择器4. 通配符选择器5. 属性选择器6. 伪类选择器一般和a元素有关7. 伪元素选择器选择器的组合选择器的并列选择器选择器帮助你精准的选中想要的元素简单选择器1. ID选择器#test{text-indent:2emline-height:2;}P idtestlorem ipuse dolor/p2. 元素选择器直接选定某类元素a { color: blue; }3. 类选择器使用class属性仅为类选择器服务每一类均有不一样的名称在style中以.名称表示那个选择器如果同时使用两个类选择器只需要在class的里面用空格隔开p classred Lorem ipsum dolor sit amet co. /p.red { color:red;}4. 通配符选择器表示选中所有元素5. 属性选择器根据属性名和属性值选中元素选中所有具有某个属性的元素[href]{color:brown;}单独选中:[hrefhttps://sina.com]{color:crimson;}6. 伪类选择器一般和a元素有关选中某些元素的某种状态1):link超链接未访问时的状态2):visited超链接访问过后的状态3):hover鼠标悬停状态表示鼠标移动上去的状态一般与其他选择器连用,表示选中鼠标悬停时的a元素变色4):active激活状态表示鼠标按下点击时的状态书写顺序是爱恨法则 love hatea:hover{color:red;}7. 伪元素选择器通常生成并选中某个元素内部的第一个子元素或者最后一个子元素使用时要有两个::beforeafter使用时相当于在元素前面和后面加了一个新的子元素存在他们独有的属性content该属性表示子元素的文本内容我想吃span芒果和草莓/span span::before{color:firebrick;content:《;}span::after{color:greenyellow;content:》}选择器的组合并且后代元素——两个选择器之间加空格.abc .bcd{color:lightgreen;}div classred ul liCumque./li li classaxSuscipit./li liMagni./li liAssumenda!/li liNostrum./li /ul /div子元素—— 只能选中子元素相邻兄弟元素—— 选中前面元素的后一个元素只能选中后面的不能选中前面的.specialli{color:darkgreen;}表示选中special这个元素的下一个元素li兄弟元素—— ~选中前面元素后面出现的所有的兄弟元素选择器的并列使用多个选择器用逗号分隔。本质上就是分开书写仅仅为了方便书写