[1] The Essentials

If you wish to write web pages, then you need to learn HTML. What’s that I here you cry! It stands for Hyper Text Markup Language, and it is dead easy to learn. Honest!
The majority of commands used in HTML are enclosed by < > and are known as tags, styles or elements. For example :

<p > TexT </p >

<TITLE > TexT </TITLE >

<H1 > TexT </H1 >

etc..

The majority of tags come in pairs ( a start and an end) and the action carried out by the tags is executed upon the text between the tags. The start tag has the form of <Tag > and the end tag has the form of </Tag >. Note the slash (/) in the end tag. It is important to end all start tags, with an end tag.

When creating Web pages, all pages must contain the following information for them to be understood by the browser.

<HTML > - Indicates that the document is a HTML File.
<HEAD > <TITLE > Title goes here </TITLE > </HEAD > - Title which appears in the top bar of your browser.
<BODY > - Everything you wish to display in your Web Pages go's here. </BODY >
</HTML >
- Indicates the end of the HTML Document.

A HTML file therefore consists of two parts:

(1) the head, which contains the title which appears in the title bar at the top of your browser. Note by default when a user creates a bookmark, then the title is used as the default.
(2) the body which contains all the information that you wish to display within your pages.

You can also include extra information (known as attributes) within the <BODY > Tag, so that it applies throughout the entire web page such as:

  • The background colour of your page
  • <BODY bgcolor="#FFFFFF" >  
  • The background image
  • <BODY background="imagelocation.gif" >   
  • The colour of your text
  • <BODY text="#000000" >   
  • The colour of your hot links
  • <BODY link="#FF3366" >   
  • The colour of your links which have been visited
  • <BODY vlink="#99FF66" >   
  • The colour of your active links
  • <BODY alink="#99FF66" > NS
  • Defines in pixels the Left hand margin
  • <BODY Leftmargin="10" > IE
  • Defines in pixels the Right hand margin
  • <BODY Rightmargin="10" > IE
  • Defines in pixels the Top margin
  • <BODY Topmargin="10" > IE
  • Defines in pixels the Bottom margin
  • <BODY Bottommargin="10" > IE
  • Bgproperties="fixed" fixes background image
  • <BODY bgproperties="fixed" > IE

    For example if you wish to have a white background and black text and red Hot links, then your body tag would read

    <BODY bgcolor="#FFFFFF" text="#000000" link="#FF0000" >TexT</BODY >

    (Note that <Tag > TexT </Tag > is the same as

    <Tag>
       TexT
    </Tag>

    i.e. the start tag and end tag do not need to be on the same line )

    What do these strange numbers "#FF3366" mean?
    They actually define the colour of your text, background etc..
    They represent the RGB codes for Various colours.

    R G B codes for various colours


    There are 140 possible colour's which are supported by Net scape by name and only 20 by Internet explorer. These are listed below. It should be noted that there are 256 possible colours. You can use any paint package to obtain the RGB value for the colour of your liking.

    "#000000"=

    Black

    Pink

    ="#ffc0cb"

    "#0000FF"=

    Blue

    Red

    ="#ff0000"

    "#A52A2A"=

    Brown

    Teal

    ="#008080"

    "#008000"=

    Green

    Maroon

    ="#800000"

    "#800080"=

    Purple

    Lime

    ="#00ff00"

    (Silver) "#c0c0co"=

    Silver

    Olive

    ="#808000"

    (White) "#ffffff"=

    White

    Navy

    ="#000080"

    (Yellow) "#ffff00"=

    Yellow

    Gray

    ="#808080"

    "#ee82ee"=

    Violet

    Aqua

    ="#00ffff"

    "#ffa500"=

    Orange

    Fuchsia

    ="#ff00ff"

    Now let us put this all together, we want to set the background colour to white, have black text, red links, and visited links in blue. Note everything in red text are Html statements, anything in black text, is user dependent.
    So the code would look something like the following:


    <HTML >
    <HEAD ><TITLE > Mannan's Home Page </TITLE ></HEAD >

    <BODY bgcolor="#FFFFFF" text="#000000" link="#FF0000" vlink="#0000FF" >
    The rest of the code goes here.
    </BODY >

    </HTML >

    The above code will simply present you with a blank white page with Mannan's Home Page inserted in the browsers title bar. Now its time to move onto some thing more advanced. S c a r e y or what?

    Previous topic Back To Contents Next Topic