Grouped Selectors
By Stephen Bucaro
A CSS style sheet consists of rules that define how html elements should be
displayed on a webpage. Each rule consists of one or more selectors, one
or more properties, and one or more values that each property
should be set to.
With a grouped selector You can associate multiple selectors with a single set of rules. The
grouped selector shown below sets style rules for multiple headline elements.
h1, h2, h3, h4
{
font-family: verdana;
font-weight: bold;
color:blue;
}
h1
{
font-size: 20px;
}
h2
{
font-size: 18px;
}
h3
{
font-size: 16px;
}
<h1>H1 Text</h1>
<h2>H2 Text</h2>
<h3>H3 Text</h3>
Note that even though the upper grouped selector sets style rules for multiple
headline elements, below that, single element selectors set different style rules
for each headline element. When a style rule is set several times for a single
element, a rule for a property set lower in the code overrides a rule for the
same property higher in the code. Also rules set lower in the cascade override
rules set higher in the cascade. That's why an inline rule overrides all previously
set rules for the same property.
More CSS Quick Reference:
• Use an Embedded Style Sheet
• Set a Fixed Background Image
• CSS background-clip Property
• Set the Letter Spacing
• Indent the First Line of Text
• Highlight Text
• Set a Background Image
• Set the Background Color
• CSS Units of Measurement
• Set the Text Color
| 
About BTH
User Agreement
Privacy
Site Map
Contact
News Feeds
RSS Feed
Follow @Stephen Bucaro
General Web Design
