Logo HTML Topics: Headings and Fonts

Course Material Index  Section Index  Previous Page  Next Page

Headings

A heading is generally placed at the beginning of a section of text. The heading size can be varied, so you can also have sub-headings. There are 6 sizes to choose from, and headings are created by enclosing text between <Hn> and </Hn>, where n is a number from 1 (largest) to 6 (smallest), for example <H1>Heading1</H1>. Two different-sized headings are always placed on separate lines. There is always some vertical space before and after a heading to create more of a visual space. The following are heading sizes from 1 through 6 going from top to bottom:

Heading1

Heading2

Heading3

Heading4

Heading5
Heading6

You should note that the heading tags cause paragraph style breaks in the text and that the text is bold type. You will see below that the same effect can be achieved another way. In most of the course material heading heading tags have not been used.

Fonts

Although the use of the font tag seems to be going out of fashion, it is still useful for setting the relative size and colours of text. It should no longer be used to set the font face since this will not work with browsers based on "Mozilla" (e.g. Netscape 6, and higher).

The different attributes of the font can be specified either individually or together:

Examples:

<FONT COLOR="RED">Red Text</FONT>  produces Red Text String;

<FONT SIZE=-1>Smaller Text</FONT>  produces Smaller Text;

<FONT SIZE=+2>Bigger Text</FONT>  produces Bigger Text

(but <FONT SIZE=2>Small Text</FONT>  produces Very Small Text);

You should note that the font size is usually specified prefixed by "+" or "-" which is taken to mean that it is relative to the current default font size as specified in the browser preferences. Note however that the font size is not directly related to the type size in points. It is also possible to specify an absolute font size (as shown), but this is generally considered bad practice since people with poor eyesight cannot rescale the fonts.

Boldface Lettering

You can create boldface text by enclosing it between <B> and </B>. For example, typing:

<B>this is in boldface</B>  produces this is in boldface.

Note:

You can create headings by the combination of boldface and font tags:
<P><FONT SIZE=+1><B>Section Heading</B></FONT><P>  produces

Section Heading

Italic Lettering

You can italicise text by enclosing it between <I> and </I>. For example, typing:

<I>this is in italics</I>  produces this is in italics.

Typewriter Lettering

You can create text in the typewriter font by enclosing it between <TT> and </TT>. For example, typing:

<TT>this is in typewriter font</TT>  produces this is in typewriter font.

The browser uses a fixed-spaced font, such as "Courier" to display text in this style. It is mainly used for displaying traditional fixed-format output produced by computer programs.


Course Material Index  Section Index  Previous Page  Next Page
© Copyright 1995-2006.  Birkbeck College, University of London.
 
 
 
Author(s): Huub Driessen
Sami Raza
Oliver Theis
Ian Tickle