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:
• How to Use a CSS ID Selector
• position:fixed
• Use word-wrap Property to allow Line Breaks in the Middle of Words
• Set the Word Spacing
• Set the Text Alignment
• Set The Cursor Style
• Set an Element's Display Property
• Set an Element's Visibility
• Set a Background Image
• Style the First Line
| 
About BTH
User Agreement
Privacy
Site Map
Contact
News Feeds
RSS Feed
Follow @Stephen Bucaro
General Web Design
