EchoEcho.Com Homepage
Web Hosting - As Reliable As It Gets!
   Home > Tutorials > CSS > Selectors


 Tutorials 
 D-Zine Articles 
 Online Tools 
 Free Resources 
 References 
 Quiz 
 Hosting 

















  CSS SELECTORS :
GROUPED SELECTORS








Most often selectors will share some of the same styles, for example, being based on the same font.
In these cases, rather than defining the font for each and every selector, one by one, you can group them, and thus assign the font to all the selectors at once.

Look at this example, made without grouping:

.headlines{
font-family:arial; color:black; background:yellow; font-size:14pt;
}

.sublines {
font-family:arial; color:black; background:yellow; font-size:12pt;
}

.infotext {
font-family:arial; color:black; background:yellow; font-size:10pt;
}


As you can see, the only style that varies is the font-size.
In the next example we have grouped the selectors, and defined the common styles at once.

.headlines, .sublines, .infotext {
font-family:arial; color:black; background:yellow;
}

.headlines {font-size:14pt;}
.sublines {font-size:12pt;}
.infotext {font-size: 10pt;}


Less to type, easier to change and guaranteed to be the same for all styles.




 << PREVIOUS
READ MORE >>  
















DEVELOPER TIP!
FACT:
EchoEcho.Com contains thousands of pages devoted to webmasters.
TIP:
Use the dropdown menus at the top to jump between different sections.





     "Better Than Books - As Easy As It Gets!"


On EchoEcho: D-Zine Articles | Tutorials | Online Tools | Free Resources | References | Quiz | HostingAbout EchoEcho