Quick links

Source Code

HTML has been widely accepted. Its initial objectives were to present text and graphic with integrated hypertext links, which allowed users to move easily between pages which were stored either locally or on different page servers. For this it created simple style tags for paragraphs and section headings. These included:

• <P>. Defines a new paragraph.
• <H1>, <H2>, . <H6>. Header 1, Header 2, . Header 6.

Along with this the <A> tag allowed support for hypertext links, and images can be incorporated with the <IMG> tag. This worked well for the basic layout of text and graphics, but fails to properly present objects in a precise form. This is mainly due to the lack of re-definition of the standard styles, thus the designer had very little control over the actual presentation of the HTML page in the browser. With standard HTML the designer cannot change the actual format of the standard styles, or define new ones, which could be reused in either page elements.

CSS tries to overcome these problems by defining a language which can be used to define font and text layout styles. World Wide Web Consortium (W3C) has standardized the format, so that most browsers support it. The CSS has not only defined a standard for WWW browsers, but one which can be used in any print layout system.

An example of a CSS definition is:

This changes the style of the <H3> tag to a font size of 14 point, with a font of either Courier New, Courier or any other mono spaced font. The margins have been set at 8 pixels on the left and right hand side, and the text align is set to justify.

Often there is a requirement to change a style of a small amount of text. In CSS this is possible where the change to a style is defined using the style modifier. For example the following changes the style for <H1> for all the text up to the end of the closing </H2> tag:

Typically, also, it is required to modify a standard style with the addition of additional styles definition, or to change defined ones. This can be done by defining a new class style onto the standard one. For example the following modify the <P> style and defines a new class (NewFormat):

This will change the <P> style for the new class named NewFormat, and modify the font type to Times New Roman, of a font size of 12 points. In this case the <P> will not be modified with this changed.