The universal selector * applies the style to all page elements, body , div , etc. However, since it is at the top of the page, this style is probably overwritten by the styles that follow.
If you want to put% red%, apply it to background , or even body , making sure there is no other rule that stands out. But if you want, for some reason, that all the elements are red, you will have to override what has already been applied to those elements.
The problem is that putting the universal selector at the bottom of the page does not have the expected effect, since for html , it has a smaller "weight" than selector of classes , ids , and tagNames tags. See:
.exemplo {
width: 100px;
height: 100px;
background: gold;
display: inline-block;
}
*{
background: red;
}
<div class="exemplo"></div>
<div class="exemplo" ></div>
<div class="exemplo" ></div>
<div class="exemplo" ></div>
Note that even putting the universal selector at the bottom of the page, the style contained in it does not overwrite those already passed.
The priority order of selectors in css is this:
Understand it and respect that styles will succeed.
