It is common to use the same style definitions for a set of Web pages. Instead of retyping them over and over for each particular document, it is possible to include them into a file and link this file to the Web page.
The linking can be done by using the <link> tag in the header of an HTML document. The general syntax for using this tag is as follows:
where URL is the URL of the linked document containing the style definitions. Again, the type attribute is not required in HTML5.
Example: the header of each Web page for this class contains the line
| <link href="../style.css" rel="stylesheet" type="text/css" /> |
where style.css is the file containing the style declarations.
Alternatively, you can use the following syntax for involving an external style file in the document header:
where URL is the URL of the style definitions file.
Example:
| <style type="text/css"> @import url(../style.css); </style> |
Example of an external style file:
| HTML tags | Comments |
|---|---|
body { background-color : #CCCC99 }
h1 { color : #CC3366;
text-align : center }
h2 { color : #FFFF00;
text-align : center }
h3, h4 { color : #0000FF;
text-align : left }
th { background-color : lightblue;
color : blue }
| Web page background color color of h1 heading alignment of h1 color of H2 heading alignment of h2 color of H3 & h4 headings alignment of h3 & h4 table header settings font color in th |