关于CSS3的优先级，简单易记的方法

CSS3的优先级

在css3中，有时会出现标签中的样式和style属性有的样式，两者会发生冲突，那么怎么个先来后到呢，个人总结如下。

！important的重要性

在css中，！important的优先级是最高的，例如：

<style>
.a{
  color:blue !important;
}
</style>
<div class="a" style="color:yellow">优先使用!important样式</div>

运行后：

就近原则

• 当style标签与外部文件style.css样式重复时，优先使用最后一个，也就是最近的一个样式，例如：

<link rel="stylesheet" type="text/css" href="/study01/style.css" />
<style>
.p1{
  color:red;
  font-size：10px；
}
</style>
<p class="p1">红色</p>

这里链接了一个外部的css样式，样式里面也有着一个对p1的修饰样式，修饰代码如下：

.p1{
     color:green;
     font-size:100px;
  }

在这里会采用就近原则，使用的是<style>标签里面的样式，运行效果：

• 当style属性的与style标签上冲突时，同样也是就近原则，例如：

<style>
.p1{
  color:red;
}
</style>
<p class="p1" style="color:green">绿色</p>

此时，离问文案最近的就是<p>标签里面的style属性，绿色的样式，
运行效果：