CSS Important

This property in CSS is used to give more importance compare to normal property. The !important means 'this is important'. This rule provides a way of making the Cascade in CSS.

If we apply this property to the text, then the priority of that text is higher than other priorities. It is to be recommended not to use this CSS property into your program until it is highly required. It is because the more use of this property will cause a lot of unexpected behavior.

If a rule is defined with this attribute, it will reject the normal concern in which the later used rule overrides the previous ones. If we use more than one declaration marked !important, then the normal cascade takes it over again. That means the new marked !important will replace the previous one.

It increases the priority of the CSS property and ignores the overriding properties.

Syntax

Example

In the above example, we can see that instead of pink, the background color of the body is light blue because, in the body tag, the !important is applied after the light blue background color.

Let's take another example of this property to understand it more clearly.

Example

In this example, we are applying the !important attribute on the border of the text. The color of the border of h1 heading will remain red despite of other declarations. The color and border-color of heading h2 will remain green and violet despite of other declarations.