Lesson 20 - Priority of CSS selectors скачать в хорошем качестве

Lesson 20 - Priority of CSS selectors

Priority of CSS selectors First, the paragraphs are given a red color, and then below – green. In this case, the second entry will override the first one and the paragraphs will turn green. The described applies only to the conflict of properties. That is, to the case when both one selector and the second have the same properties. If the properties are different, then the properties of both one and the second selector will simply be applied. Specificity rules In the previous example, both selectors were the same and had the same priority. This means that the property that was written below won. There are also situations when several selectors correspond to one-page element. In this case, a more specific, that is, a more precise selector, will win in the case of a conflict of properties. Rule one The class always wins the tag selector. Rule two The identifier always wins the class. Rule three Under equal conditions, the selector with the most parts wins. For example, if we have two tag selectors, the one with more tags will win. If there are two class selectors, then the one with more classes specified will win (if there are tag selectors, then they do not affect). Parents In all the previous examples, all selectors should catch the element itself. It may be that one selector catches an element, and the second selector catches the parent of this element. You already know that if a parent is given, for example, a color, then this color will be inherited by the child. But, if the child is also given a color, then the selector of the child will have a higher priority than the selector of the parent. The descendant class selector also defeats the parent identifier. If something in this lesson remains unclear, these issues are probably well described in previous lessons. If you go back to the previous lessons, you will probably get it right. Good luck with your self-education. Music: www.davidcuttermusic.com https://www.davidcuttermusic.com