前言
作为一个web端工程师，不可避免的会用到css，知道css的权重原则可以帮助我们更好更快的去理解css。
权重列表
| 类型 | 权重 | eg： |
|---|---|---|
| html 标签 | 1 | p(标签){} |
| class | 10 | .test{} |
| id | 100 | #test{} |
组合类型
| 类型 | 权重 | eg： |
|---|---|---|
| 组合标签 | 1 + 1 | div em{} |
| 标签和class | 10 + 1 | div.test{} |
| 标签和class | 100 + 10 | #test .red{} |
tips: 选择符权重相同的情况下，样式会遵循就近原则，哪个选择符最后定义，就采用哪个选择符的样式。
结论
css 选择符的权重越高，样式就越不容易被覆盖，越容易对其他选择符产生影响，所以为了保证样式容易被覆盖，提高可维护行，css 选择符需保证权重尽可能低。
