Cascading Style Sheets (CSS); Backgrounds (part 2 of 2)
By Will Bontrager2003-10-15
The Background Behind Sections of Text Content
Background color and images can be specified for standard HTML tags for text content, too. It is almost identical to the DIV and table style specifications, except no period is typed in front of the style. (The period indicates a custom class. Lack of a period indicates a style for a standard HTML tag.) Standard HTML tags for text content do not have the ability to be sized except for the amount of area the text itself requires.
To specify a background of yellow for H1 (header size 1) text and an image background for P (paragraph) text, put this in the HEAD section of your web page:
<style type="text/css">
<!--
H1 { background-color: yellow; }
P { background-image: url(image.jpg); }
-->
</style>
Now, in the following page copy, the header will have a yellow background and each paragraph will have an image as its background. Example:
<H1>My Header</H1>
<P>A paragraph.</P>
<P>Another paragraph.</P>
Image tiling and positioning are specified using the same specifications language as the class for DIV sections.
Tutorial Pages:
» Introduction
» The Background of Divisions of the Web Page, Within DIV Tags
» The Background of Tables
» The Background Behind Sections of Text Content
» The Background Behind INPUT and TEXTAREA Form Elements
» Example for the HEAD section
» The Background Behind Ordered and Unordered Lists
» Here are examples for the HEAD area
Copyright 2004 Bontrager Connection, LLC
