Defining Styles
Styles can be defined in a page header, to avoid repeatedly specifying a particular formatting each time it is used.
<HEAD>
<STYLE>
H1{font: 22pt Arial, Helvetica, sans-serif}
</STYLE>
In the above example, the H1 level header will appear in 22 point Arial font if this font is installed on the computer of the person accessing the page, otherwise in Helvetica, and if neither of these fonts is available, in a sans serif font.
This possibility can be used in all tags that define which font to use for display.In the example below, when the H1 tag indicates that style is “Style1Plus” (<H1 class=Style1Plus>), the color red is added, replacing the color used by default.
<STYLE>
H1{font: 22pt Arial, Helvetica, sans-serif}
H1.Style1Plus {color: red}
</STYLE>
It is possible to define a style that applies to all tags, by declaring it as follows:
.StyleName{formatting}
This style can be used in form H1.StyleName, TR.StyleName, etc.
When pages are displayed, priority is given to the format nearest to that of the element concerned. If a style is first defined in a style sheet, then redefined in a header, then defined a third time in the body of the text, it is the final definition that will be taken into account.
The different definitions will supplement each other if not contradictory: a style defining a color in the style sheet will remain valid if the redefinition concerns, for example, only the font size.Style sheets are text files, as are HTML pages. They generally have the extension CSS, for Cascading Style Sheet. They are indicated in the META section as follows:
<LINK REL=STYLESHEET TYPE="text/css" HREF="../STANDARD/NEUTRAL.CSS">
|
Defined elements
|
Font
|
Size
|
Color
|
|---|---|---|---|
|
Style sheet
|
Arial
|
12
|
Blue
|
|
Header (HEAD)
|
|
18
|
|
|
Result
|
Arial
|
18
|
Blue
|
Example of cascading style operation
|
Defined elements
|
Font
|
Size
|
Color
|
|---|---|---|---|
|
Style sheet
|
Arial
|
|
|
|
Header (HEAD)
|
|
18
|
|
|
Tag
|
|
size:20
|
color=red
|
|
Result
|
Arial
|
20
|
red
|
A further example of cascading style operation
Just as there are HTML editors, there is software for modifying style sheets without having to know the formatting codes. These codes are documented in numerous Web sites (including http://www.W3.org/, site for the World Wide Web Consortium).
In pages generated with the HTML generator, default styles are indicated with indication of which object is concerned.