A Smarter Way To Learn HTML & CSS(2015)

20
Grouping

You can group elements that share one or more style characteristics. For example, if h1, h3, and h5 headings are all to be in the Arial font or one of its relatives and you want them all centered, you can write…

h1, h3, h5 {
font-family: Arial, Helvetica, sans-serif;
text-align: center;
}

Now all three types of headings share the same font-family and text alignment.

This doesn’t prevent you from individually styling these elements with other characteristics. For example, if you want h1 and h5 headings in one color and h3 headings in another color, you could add this code…

h1, h5 {
color: #333333;
}
h3 {
color: #999999;
}

Now all three heading types share the same font-family and text alignment. h1 and h5 headings are one color. And h3 headings are another color.

In your CSS file group h4 headings and a class of paragraphs that center. In your HTML file code an h4 heading and a paragraph of that class. Save the files and display the page.

Sample CSS code is at:
http://asmarterwaytolearn.com/htmlcss/practice-20-1.html.

Sample HTML code is at:
http://asmarterwaytolearn.com/htmlcss/practice-20-2.html.

Find the interactive coding exercises for this chapter at:
http://www.ASmarterWayToLearn.com/htmlcss/20.html