Selector grouping
Based on the original basis, we want to set the files in the following html files to the same color. We can do this: html:
<h1>php中文网</h1> <h2>php中文网</h2> <h3>php中文网</h3> <h4>php中文网</h4>
css:
h1{ color: cadetblue; } h2{ color: cadetblue; } h3{ color: cadetblue; } h4{ color: cadetblue; }
This is the following The rendering:
But we usually write css like this:
h1,h2,h3,h4{ color: cadetblue; }
The effect is the same, there is no change at all:
Does this reduce a lot of code? This is called grouping of selectors. The knowledge we need to add next is the wildcard *. To achieve the same effect as before, another way is, Use wildcards.
*{ color: cadetblue; }
In this way, if there are no settings for specific elements, color conversion will occur. Some students below will ask questions. If we don’t want them to be all the same, some of them use other settings. Well.
To solve this problem, we only need to overwrite it. If we want the last title to be black and gray, then just add the following sentence after it:
h4{ color: darkslategray; }
In this case, we can see the following effect:
But generally when we use wildcards, we set the margins and margins of the entire page. Like this
*{ padding: 0px; margin: 0px; }