1.ID选择器（一对一关系）
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" type="text/css" href="css/two.css"/> </head> <body> <div id = "only"></div> </body> </html>
#only{ width: 100px; height: 100px; background-color: aqua; }
2.class选择器（多对多）
<div class = "demo">123</div> <div class = "demo">234</div>
.demo{ background-color: aqua; }
或者
<div class = "demo demo1">123</div> <div class = "demo">234</div>
.demo{ background-color: aqua; } .demo1{ font-size: 30px; }
3.标签选择器（一选就是全部，不管别套几层都能作用上）
<div> <span>123</span> </div> <span>234</span>
span{ background-color: aquamarine; }
4.通配符选择器（all,any）真个界面都变色，因为通配符选择器就是作用于所有标签
<span>123</span> <div>hhhhhhh</div> <em>houhou</em> <strong>heihei</strong>
*{ background-color:#ff3344 ; }
5.属性选择器（可以写名或名+值不能单独写值）
<div id = "only" class ="demo">123</div>
不可以直接写only
[id]{ background-color: #008000; }
[id = "only"]{ background-color: #008000; }
原文：https://www.cnblogs.com/foximengxin/p/12405067.html