What is Specificity? Specificity means the quality or condition being specific(clearly defined or identified).
You might think what is the use of specificity in the CSS. When there are multiple styles applied to a single element, the browser has to identify which specific style it should apply to that particular element, the style that is more specific i.e. the style with more specificity.
First, let’s talk about using Inline, Internal and External stylesheets. If we are using all the three types of stylesheets for styling our HTML page and we have applied a particular style to the same element in all the three stylesheets then which style will be applied to the element. The answer is the Inline Style. Let’s look at an example.
Now, we will look at how specificity is calculated if we are applying multiple styles to the same element.
Here is a look of most to least specificity depending on the selectors:
Additional Information On Specificity :
This was all about CSS Specificity. It is an important concept to learn. If you have any questions then please do let me know in the comments of this post.