CSS 的 !important 规则用于使声明优先于普通声明。
该规则旨在允许用户覆盖站点 CSS 嵌入 CSS 和外部 CSS 样式表中的作者（网页设计师和开发人员）声明。

作者也可以使用它来覆盖他们自己的样式，但这通常被认为是一种不好的做法，因为它很容易编写 HTML（带有类和 ID），因此我们无需考虑使用 !important。
有时，作者 StyleSheet 中的给定规则优先于其他规则，在这种情况下，他们可以使用 !important 规则（作为快速而肮脏的修复），应用类或者 ID 或者将其选择器更改为不太一般。
例如：编写以下内容：

article a:link {}
article a:visited {}
article a:hover {}
article a:active {}

而不是只写 a:link {}，而不是针对文章元素。
编写更具体的规则可以避免编码 CSS 时出现的大多数问题。

但是，用户指定的 !important 规则将优先于作者 !important 规则。

作者

我们可能已经尝试过，当我们尝试保持尽可能干净时，我们经常会在某些时候出现重叠样式。
解决这个问题的一个快速而“肮脏”的方法是使用 !important 规则。

由于 !important 可以引发自己的问题，建议避免它，除非确实有必要。
例如：CSS 声明不可能更具体。

用户

如果用户发现网站难以查看，则可以使用 !important 规则。
例如：色盲用户。
问题是他们是否会这样做。
大多数用户可能不太了解 CSS（如果有的话），并且可能不知道这种可能性。

为网站提供多种配色方案可能会更好，但遗憾的是，这可能是一项乏味的任务。

用户可以将自己的默认样式添加到自定义样式表，然后将其加载到浏览器中。
某些浏览器允许直接从设置部分进行此操作。
如果我们希望将自己的样式表添加到浏览器，我们应该阅读文章：在浏览器中使用自定义样式表。

使用 !important 规则

在下面的示例中，我们首先选择 a 中的所有 img 元素，然后我们尝试使用 !important 规则覆盖该选择，使用针对所有 img 元素的不太具体的选择器。

/* Normal declaration */
a img {border:3px solid #000000;}
  /* With !Important */
img {border:3px solid #000000 !important;}

在此示例中，最后一个声明将优先于第一个声明，尽管不太具体说明将样式应用于哪些元素。

选择器越具体，它的优先级就越高。
!important 规则具有最高优先级，无论选择器本身有多具体。