You can use inheritance to your advantage to streamline your style sheets. Say you want all the text on a page to use the same font. Instead of creating styles for each tag, simply create a tag style for the <body> tag. (Or create a class style and apply it to the <body> tag.) In the style, specify the font you wish to use, and all of the tags on the page inherit the font: body { font-family: Arial, Helvetica, sans-serif; }. Fast and easy.
You can also use inheritance to apply style properties to a section of a page. For example, like many Web designers, you may use the <div> tag (Section 3.1) to define an area of a page like a banner, sidebar, or footer. By applying a style to a <div> tag, you can specify particular CSS properties for all of the tags inside just that section of the page. If you want all the text in a sidebar to be the same color, you'd create a style setting the color property, and then apply it to the <div>. Any <p>, <h1>, or other tags inside the <div> inherit the same font color.
Get CSS: The Missing Manual now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
