我们一般写的都是作者样式表，加入!important会使得优先级反过来
平常不推荐使用!important
02 选择器优先级
-
标签选择器：例如，
p选择所有的<p>元素。 -
类选择器：.className
-
ID选择器：#id
-
属性选择器：根据元素的属性和属性值选择元素。e.g.
[data-attribute]选择具有data-attribute属性的所有元素，[data-attribute="value"]选择具有data-attribute属性且其值为value的所有元素。 -
伪类选择器：选中某个特定状态或者或相对于其父级或兄弟元素的位置的元素。e.g.
:hover,:first-child -
伪元素选择器：匹配在文档中没有直接对应HTML元素的特定部分，e.g.::before和::after可以添加到选择器以创建伪元素的关键字。伪元素被插入到与选择器匹配的元素内容之前或之后。
content属性
1）::before和::after必须配合content属性来使用，content用来定义插入的内容，content必须有值，至少是空
2）这些添加不会出现在DOM中，不会改变文档内容，不可复制，仅仅是在css渲染层加入。所以不要用:before或:after展示有实际意义的内容，尽量使用它们显示修饰性内容
- 后代选择器（空格）：e.g.`div p`选择所有作为`<div>`元素后代的`<p>`元素。
- 子元素选择器（`>`）：例如，`div > p`选择所有作为`<div>`元素直接子元素的`<p>`元素。一定是直接！
- 相邻兄弟选择器（`+`）：例如，`div + p`选择紧跟在`<div>`元素后面的`<p>`元素。
- 一般兄弟选择器（`~`）：例如，`div ~ p`选择在`<div>`元素后面的所有`<p>`兄弟元素。
- 多个选择器：使用逗号分隔的多个选择器可以同时选择符合任一选择器条件的元素。例如，
div, p选择所有的<div>和<p>元素。
源码顺序
谁在最后，谁就赢了！
h1标签的字体颜色是绿色
所以自己的样式一定要加载在第三方引用库的后面才会生效
继承
.card h1会继承card的字体大小，覆盖掉28px
