引用样式
css 的引用有三种，行间式、内嵌式、外链式
行间式
<div style="width:200px;height:200px"></div>
行间式最大的特点就是写在标签上面，级别最高，缺点是容易影响阅读，修改比较麻烦
内嵌式
<head> <style> div{height: 100px;width: 100px;background: red;} </style> </head>
内嵌式最大的特点就是嵌入在 html 文件里，级别中等，缺点是影响 html 文件大小
外链式
<head> <link rel="stylesheet" type="text/css" href="2.css"> </head>
最大的特点就是引入外面的 css 文件，级别最低，href 为文件的位置，rel 和 type 告诉引用的是 css 文件，固定写法。
css 选择器
全选符*
<style> *{height: 100px;width: 100px;background: red;} </style>
会将html、body都选中，权重最低
标签选择器
<style> div{height: 100px;width: 100px;background: red;} </style>
通过标签的分类来选择 html 元素，权重比全选符高
类（class）选择器
<html> <head> <style> .abc{height: 100px;width: 100px;background: red;} </style> </head> <body> <div></div> <div class="abc"></div> </body> </html>
我们可以定义分类，然后通过我们定义的分类去给予样式，权重比标签选择器高，通过点获取
id选择器
<html> <head> <style> #abc{height: 100px;width: 100px;background: red;} </style> </head> <body> <div></div> <div id="abc"></div> </body> </html>
权重最高的选择器，我们可以给元素设定一个唯一的 id 值，通过 # 号获取 id 选择器
后代选择器
<style> .busy .zou{height: 100px;width: 100px;background: red;} </style>
选择class 为 busy 下面的，class 为zou的所有标签，后代选择器中间用空格隔开，可以使用 id、标签、全选符
<style> * #zou{height: 100px;width: 100px;background: red;} </style>
群组选择器
<head> <style> p,div{color:red;} </style> </head> <body> <div>divdivdivdivdiv</div> <p class="abc">pppppp</p> </body> </html>
把我们想要定义相同样式的标签放在一起，中间通过逗号隔开
子级选择器
<html> <head> <style> .zou>.busy{color:red;} </style> </head> <body> <div class="zou">divdivdivdivdiv <div class="busy">busy</div> </div> <p class="busy">pppppp</p> </body> </html>
子级选择器通过 > 符合选择下面的标签，子级选择器最大的特点是可以选择到下面的第一层元素，不会选择到其他无关的元素
