Course Content

  • Lecture-29_specificity-rule-one
  • Lecture-29_specificity-rule-three
  • Lecture-29_specificity-rule-two

Course Content

FAQs

CSS specificity is a crucial concept to grasp if you want to improve your CSS skills. It is the collection of rules that define which style is applied to an element using CSS selectors. To fully comprehend this, we must first comprehend a similar issue — CSS cascading.

CSS specificity is a term that describes how significant a selector is. The greater the selector's number, the more specific it is, and the more likely that block of CSS will win the stylistic wars.

To fix this, we need to increase the CSS selectors' specificity values in the media query. The browser will follow the source order rule if the CSS selectors that target the same HTML elements have the same specificity.

Different kinds of specificity are:

  • Generic: The word or phrase applies to all elements on the page;
  • Class Specific: The word or phrase applies only to one class;
  • ID Specific: The word or phrase applies only to one element with an ID;
  • Attribute Specific: The word or phrase applies only to one attribute on an element.

The first selector is the universal selector (*). This selector is used to target any element on a given web page and can also be used as a pseudo-class. The universal selector can also be used in conjunction with other selectors by adding it in front of them. For example, you could add * before an element’s ID to target only that particular element or class rather than all of the elements with that class.

Recommended Courses

Share With Friend

Have a friend to whom you would want to share this course?

Download LearnVern App

App Preview Image
App QR Code Image
Code Scan or Download the app
Google Play Store
Apple App Store
598K+ Downloads
App Download Section Circle 1
4.57 Avg. Ratings
App Download Section Circle 2
15K+ Reviews
App Download Section Circle 3
  • Learn anywhere on the go
  • Get regular updates about your enrolled or new courses
  • Share content with your friends
  • Evaluate your progress through practice tests
  • No internet connection needed
  • Enroll for the webinar and join at the time of the webinar from anywhere