这里总结一共有11种选择器，分别为：
通配符选择器、类选择器、id选择器、元素选择器（又叫标签选择器）、属性选择器、
伪类选择器、伪元素选择器、后代选择器（又叫包含选择器）、子元素选择器、兄弟选择器（相邻兄弟选择器+、通用兄弟选择器~）、群组选择器（几个共用一个，用逗号隔开）
（优先级：！important>行间样式>id>class=属性=伪类选择器>元素=伪元素选择器>通配符）
1、通配符选择器
语法：* {属性名：属性值；属性名：属性值； ........} 为页面上的所有元素设置样式，优先级最低
*{ margin:0; padding:0; }
2、类选择器
语法：.类名{属性名：属性值；属性名：属性值； .......} 为含有相同类名的元素设置样式
<style> .s1{ color:red; } </style> <body> <p class='s1'>aa</p> <p class='s2'>bb</p>
<p class='s1 s2'>cc</p>
<!----aa和cc的字体颜色为红色----> </body>
3、id选择器
语法：#id名{属性名：属性值；属性名：属性值； .......} 为id属性值为指定id名的元素设置样式
<style> #d1{ color:red; } </style> <body> <p id='d1'>aa</p> <p id='d2'>bb</p> <!----aa的字体颜色为红色----> </body>
注意：在一个html文档中，一个id名只能使用一次；且不能使用id词列表
<p id='d1'>aa</p> <p id='d1'>bb</p> <!----错误，一个id名只能使用一次----> <p id='d2 d3'>cc</p> <!-----错误，不能使用id列表-------->
4、元素选择器
又叫标签选择器，根据元素名（标签名）来设置样式
语法：元素名{属性名：属性值；属性名：属性值； .......} 为所有指定的元素设置样式
<style> p{
color:red; } </style> <body> <p>aa</p> <div> <p>bb</p> </div> <p >cc</p> <!----aa、bb和cc的字体颜色均为红色----> </body>
5、属性选择器
具体分为三种：
①简单属性选择器：选择具有某个属性名的元素
语法：[元素属性名]{属性名：属性值；属性名：属性值； .......} 选择有指定属性名的元素，而不管元素的该属性的属性值是什么
<style> [href]{ color:red; } </style> <body> <a href='taobao'>taobao</a> <div> <a href='baidu'>baidu</a> </div> <a href='tencent' >tencent</p> <!----taobao baiidu和tencent的字体颜色均为红色----> </body>
②具体属性值选择器：选择具有指定属性键值对（属性名和属性值都要匹配）的元素
语法：[元素属性="属性值"]{属性名：属性值；属性名：属性值； .......} 属性名和属性值要完全匹配
<style> [href='taobao']{ color:red; } </style> <body> <a href='taobao'>taobao</a> <div> <a href='baidu'>baidu</a> </div> <a href='tencent' >tencent</p> <!----taobao的字体颜色均为红色----> </body>
③子串匹配属性选择器：可以规定属性值包含什么字符串(*)或以什么字符串开头(^)/结尾($)
语法：[元素属性^="def"]{属性名：属性值；属性名：属性值； .......} 相应的属性值以def开头的元素
[元素属性$="def"]{属性名：属性值；属性名：属性值； .......} 相应的属性值以def结尾的元素
[元素属性*="def"]{属性名：属性值；属性名：属性值； .......} 相应的属性值包含def的元素
<style> [href^='t']{ color:red; } [href$='u']{ color:yellow; } [href*='b']{ font-size:30px; } </style> <body> <a href='taobao'>taobao</a> <div> <a href='baidu'>baidu</a> </div> <a href='tencent' >tencent</p> <!----taobao和tencent的字体颜色为红色;baidu的字体颜色为黄色;taobao和baidu的字体大小为30px----> </body>
6、后代选择器（又叫包含选择器）
语法：祖先元素 后代元素 {属性名：属性值；属性名：属性值； .......} 为具有指定祖先元素的所有后代元素设置样式 ，这两个元素之间的层次间隔可以是无限的
<style> .s1 p{ color:red; } </style> <body> <p>aa</p> <div class='s1'> <p&