css优先级及其计算方法

https://blog.csdn.net/xiaojinguniang/article/details/82869841

1、CSS优先级比较

!important  >  内联样式  >  id  >  class  >  标签  >  通配符  >  继承  >  默认

2、CSS权重计算

一等：内联样式，如 style="",权重为1000.

二等：id选择器，如 #content，权重为0100.

三等：代表类，伪类和属性选择器,如.content，权重为0010

四等：代表标签，伪元素，如 div ,p ,权重为0001

五等：通用选择器（*）,子选择器(>) ,相邻同胞选择器(+),权值为0000

问题分析：

1、权重相同的两个样式都映射到一个标签上，哪一个会被覆盖？

答：权重相同的话和书写顺序有关，写在前面的会被后面的覆盖。

2、权重相同，一个样式定义在html中，一个定义在css中，哪个会被覆盖？

答：和文件的顺序有关

3、同一个标签有多个类名来修饰，类名的先后顺序对样式有影响吗？

4、权重相同的基础上，后面写的样式是会覆盖前面的对应样式还是覆盖前面的所有样式？

答：覆盖前面的对应样式

5、跳级引用，跳过标签的缩少对样式有影响吗？

答：跳级不影响，主要看权重和先后顺序。

6、内联样式的权重为1000，10个id选择器的权重也为1000，结果依然显示的是内联样式