When we are making web page code, there are some special situations where we need to set the highest weight for certain styles. What should we do? At this time we can use !important to solve it.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>!important</title>
<style type="text/css">
p{
color:red!important;
}
p.first{
color:green;
}
</style>
</head>
<body>
<h1>勇气</h1>
<p class="first">三年级时，我还是一个<span>胆小如鼠</span>的小女孩，上课从来不敢回答老师提出的问题，
生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
<p id="second">到了三年级下学期时，我们班上了一节公开课，老师提出了一个很
<span class="first">简单</span>
的问题，班里很多同学都举手了，甚至成绩比我差很多的，
也举手了，还说着："我来，我来。"我环顾了四周，就我没有举手。
</p>
</body>
</html>At this time, the text in the p paragraph will be displayed in red.
Note: !important should be written in front of the semicolon
Note here that when the web page creator does not set the css style, the browser will display the web page according to its own set of styles. And users can also set their own custom styles in the browser. For example, some users are used to setting the font size to a larger size so that they can view the text of the web page more clearly. At this time, please note that the style priority is: browser default style < web page creator style < style set by the user, but remember that the !important priority style is an exception and has a higher weight than the style set by the user.
Next Section