Home | E-mail
HTML Basics - Part 3 of 12 by Matthew Bacon
Formatting Text The body section contains any text, images, links etc. that you want the browser to display. HTML provides a variety of tags to enhance the look of your web page, some of these are shown below. Headings There are six levels of headings. Level 1 is the largest while level 6 is the smallest, as shown below.
`<H1>`Heading level 1`</H1>` | # Heading level 1
`<H2>`Heading level 2`</H2>` | ## Heading level 2
`<H3>`Heading level 3`</H3>` | ### Heading level 3
`<H4>`Heading level 4`</H4>` | #### Heading level 4
`<H5>`Heading level 5`</H5>` | ##### Heading level 5
`<H6>`Heading level 6`</H6>` | ###### Heading level 6
Breaking up To break up your blocks of text, HTML employs the tags `<P>` ... `</P>` and `<BR>`. This is because, any carriage returns or empty lines within your HTML code are ignored!
For example, | ... would be displayed as,
    Welcome to the
    World Wide Web.
    Welcome to the World Wide Web.
However, if you place the tag `<BR>` like so, | ... would be displayed as,
    Welcome to the<BR>
    World Wide Web.
    Welcome to the
    World Wide Web.
To include a paragraph break within a block of text, the tag `<P>` should be used. This tag can also control the justification of the paragraph using the `ALIGN=""` attribute.
For example, | ... would be displayed as,
    <P ALIGN="LEFT">
    Welcome to the World
    Wide Web
    </P>
    Welcome to the World Wide Web
    <P ALIGN="CENTER">
    Welcome to the World
    Wide Web
    </P>
    Welcome to the World Wide Web
    <P ALIGN="RIGHT">
    Welcome to the World
    Wide Web
    </P>
    Welcome to the World Wide Web
Horizontal Rule You are not just restricted to breaking up your blocks to text with whitespace. The `<HR>` tag can be used to produce a horizontal line the width of the browsers window. A rule's size and width can be set using the attributes `SIZE=` (thickness of line) and `WIDTH=` (as a percentage of the browser window). The horizontal rule is automatically centered, although you can use the `ALIGN=""` attribute if you wish. For example,
    <HR SIZE=4 WIDTH="75%">
For example,
    <HR SIZE=2 WIDTH="50%" ALIGN="RIGHT">
Text emphasis Like a word processor, HTML allows you to emphasis portions of text as bold, underlined and italic. Many "special effects" can also be applied such as blink, subscript, superscript and typewriter.
For example,
    <B>
    This text is bold
    </B>
| ... would be displayed as, This text is bold
    <U>
    This text is underlined
    </U>
| This text is underlined
    <I>
    This text is in italics
    </I>
| This text is in italics
    <BLINK>
    This text is blinking
    </BLINK>
| This text is blinking
    <SUB>
    This text is subscript
    </SUB>
| This text is subscript
    <SUP>
    This text is superscript
    </SUP>
| This text is superscript
    <TT>
    This text is typewriter
    </TT>
| `This text is typewriter`
    <FONT SIZE=7>
    This text is huge
    </FONT>
| This text is huge
    <FONT SIZE=1>
    This text is very small
    </FONT>
| This text is very small
    <FONT COLOR="#FF0000">
    This text is red
    </FONT>
| This text is red
    <FONT COLOR="#00FF00">
    This text is green
    </FONT>
| This text is green
    <FONT COLOR="#0000FF">
    This text is blue
    </FONT>
| This text is blue
Previous | Next
MyAtari magazine - Tutorial #3, April 2001 | Contents Features Reviews Tutorials Regulars Adverts
[ Top of page ]
Copyright © 2001 MyAtari