It’s all about the key selector
What determines the impact of a selector is its key selector. The key selector is a very important thing in the world of CSS as browsers read selectors
right to left
. This means the key selector is the last one before the opening {, for example:
.header ul { /* ‘ul’ is the key selector */ }
.ul li a { /* ‘a’ is the key selector */ }
p:last-child { /* ‘:last-child’ is the key selector */ }