Nothing is for sale here. Freewill tips keep the site running. Want to help? → Tip via Paypal
Multiple Selectors, Same Value
Suppose you want all the headings on your page displayed in the same color. Rather than list each heading size separately you can list multiple selectors in one declaration. This style rule:…means the same as this:
h2 {color: brown;}
h3 {color: brown;}
h4 {color: brown;}
h5 {color: brown;}
h6 {color: brown;}
The first line of code is certainly much easier to write and edit than the other six lines, but the two methods of writing the style rules tell the browser the exact same thing.
Any time you want multiple elements to have the same properties and values just list all the elements, separated by a comma, and at the end of the string add the properties and values you wish to effect.
The selectors don’t have to be all the same type of elements, such as all heading tags. The elements can be mixed. For example:
That would set the font size to 14 pixels for text in any table, division, or paragraph element that doesn’t have a separate rule higher in the cascading order.
It’s as easy as that.
Since this tutorial is so short, here’s an image you can use with a wise old saying I just made up…
