I was curious because you said that the id selector's score is 100 points and the class' score is 10 points, so I made an example sentence on the code pen.
https://codepen.io/Neodahl/pen/MVXxyg
In the pen above, when you use one id selector for the p tag and 11 class selectors at the same time, the style of the class should be applied, but the style of the id selector will be applied.
I don't know what's wrong with the way I calculated<
fast-frontend css cascade
Hello, I'm YAMOO.
In the video lecture, I told you that for convenience, the score of the id
attribute is higher than the class
attribute, so it is a priority.
However, @NeoDahl did it himself, and even if the number of classes was 11, it could not take precedence over the id attribute value. There's a reason for this. Let's find out why. :-)
CSS is a language where understanding the concept of cascade(priority) is important.
At the most basic level, the order of the CSS rules is important, but it's actually more complicated. Which choice has priority in a cascade depends on three factors.
From the results of the practice based on item 2, it is easy to think that the class
attribute with 11 values will take precedence over the id
attribute value. If you look at the image below, you can see the score criteria based on the number of each attribute.
However, the priority over item 2 is importance.
This means that no matter how many class
property values are, they are less important than the id
property. Looking at the image below, CSS cascading has a higher priority than calculating property values.
It would be helpful if you read the reference book below in additionally. :-)
FIN.
© 2024 OneMinuteCode. All rights reserved.