Interactive Learning and Design |
Style Sheets are a way to control from one file the look of a whole Web site. This site, for instance, is laidout using this external Style Sheet file:
BODY {background-color:
#FFFBF0; font-family: Arial, Verdana, sans-serif }
P {fontsize: normal; line-height: 1.2; text-align: justify; font-family: Arial,
Verdana, sans-serif; margin-left: 18%; margin-right: 17%}
H2 {text-align: center; font: bold 20pt/22pt Arial, Verdana, sans-serif; }
H3 {text-align: center; font: bold 17pt/19pt Arial, Verdana sans-serif }
H4 {text-align: center; font: bold 12pt/16pt Arial, Verdana sans-serif; color:
#888888 }
H5 {text-align: left; font: bold 12pt/13pt Arial, Verdana, sans-serif }
H6 {text-align: center; font: normal 10pt/14pt Arial, Verdana, sans-serif
}
It is in the site directory and the file is titled general.css - the ending, .css is required on all Cascading Style Sheet files.
Note particularly how the different elements are specified - BODY, P, H2, H3, H4,H5, H6 and how the specifications are set between curly braces { }.
If there are changes in the CSS file they will take effect through out the site if this markup is in the HEAD of each document in it:
<LINK REL=STYLESHEET HREF="general.css" TYPE="text/css">
You can also use Style Sheet specification in the <HEAD> of the HTML document and in the <BODY>, as well. The specification closest to the <BODY> of the document takes precidence.
There are many other aspects of your layout that can be determined by Style Sheets. The details are in your text, HTML: The Definitive Guide.
I have added a site from Embedded Style Sheets.
See also:
webmonkey/stylesheets
WR Style Sheets Reference
Guide
CSS Pointers Group
