How To Make Links
tagshk.gif (2195 bytes)


Specifies that the contained text is to be made a heading. The n represents a number between 1 and 6. So to make a heading, level 1, you would use <h1>Heading text</h1>. The different headings are shown below.

Heading Level 1

Heading Level 2

Heading Level 3

Heading Level 4

Heading Level 5
Heading Level 6

Even though this tag creates several different sizes of text, this should only be used for specifying headings. Do not use this instead of <font> or <basefont>. <H> has one attribute.

  • align=

    Specifies the alignment of the heading. Values are left (default), right, and center.

    <h3 align=center>Center Heading</h3>

Center Heading

  I.E. Netscape
<Hn> X X

HTML Reference
| Tags A | Tags B | Tags C | Tags D | Tags E-G |
| Tags H-K | Tags L-N | Tags O-R | Tags S | Tags T | Tags U-Z |


Displays a horizontal rule. A horizontal rule is just a line across the page. Using the attributes, you can control various aspects of the way the line looks.

  • color=

Sets the color of the line. Can be in either named form or in RGB Hex form. (See my Color Tutorial for more info.)

<hr color="red">

  • size=

Sets the vertical height or thickness of the line. Value is in pixels.

<hr size="10" color="00FF00">

  • width=

Sets the length of the line as it goes across the screen. Values are either in a percent or in pixels.

<hr width="50%" color="#336699">

  • align=

Specifies the alignment of the line. Values are left, right, and center (default).

<hr align="right" width="100" color="99CCFF">

  • noshade

Turns off the default 3-D shading of the line.

<hr size="15" noshade>

  I.E. Netscape
<hr> X X
   ...color X  
   ...size X X
   ...width X X
   ...align X X
   ...noshade X X

HTML Reference
| Tags A | Tags B | Tags C | Tags D | Tags E-G |
| Tags H-K | Tags L-N | Tags O-R | Tags S | Tags T | Tags U-Z |


Specifies the heading section of the document. The head section contains information about the document, unlike the <body> which contains the document's visible contents. The head tag is not a tag that is visible in the document, but rather contains tags relating to the document. The head tag is a required HTML page element. The structure of an HTML document is as follows:

<title>Page's title goes here</title>

The page's body goes here.

The tags that can be placed in the <head> are <title>, <meta>, <script>, <style>, <link>, and <base>. The title is the only one of these tags that is a required element of an HTML document.

  I.E. Netscape
<head> X X

HTML Reference
| Tags A | Tags B | Tags C | Tags D | Tags E-G |
| Tags H-K | Tags L-N | Tags O-R | Tags S | Tags T | Tags U-Z |


Specifies that the current document is an HTML document. This is a required element of an HTML document. Although some current browsers will, in fact, display the content of the page correctly without it, current HTML specifications say that this tag is required to be compliant. It's just good to be compliant with the W3C's official HTML specifications. The html tag is the first tag of the document. The closing tag is the last tag in the document. In some cases the HTML version identifier is located before the html tag. Don't ask me to explain the HTML version identifier because I don't understand it myself. Here is the required format of an HTML document.

<title>Page's title goes here</title>

The page's body goes here.

For more information on the other HTML page divisions, see <head>, <title>, and <body>.

  I.E. Netscape
<html> X X

HTML Reference
| Tags A | Tags B | Tags C | Tags D | Tags E-G |
| Tags H-K | Tags L-N | Tags O-R | Tags S | Tags T | Tags U-Z |


A physical for displaying text italicized.

<i> I'm in italics!</i>

I'm in italics!

  I.E Netscape
<i> X X

HTML Reference
| Tags A | Tags B | Tags C | Tags D | Tags E-G |
| Tags H-K | Tags L-N | Tags O-R | Tags S | Tags T | Tags U-Z |

iframe.gif (2343 bytes)

Creates a "floating" frame in the middle of the document. Before you continue with this tag, please refer to my Frames Tutorial for the complete guide to standard frames.

A floating frames is basically a page that is places smack dab in the middle of the page. The <iframe> and </iframe> tags are included in the file that is to have the frame placed in it. So if I wanted a floating frame in this document, I would just add the <iframe> tags to this document.

NOTE: This is an Internet Explorer specific tag. In order to display text for other browsers, include the alternate text between the <iframe> and </iframe> tags. You use the attributes of the <iframe> tag to describe the ffile to be placed into the frame.

  • src=

Specifies the location of the page to be placed into the frame.

<iframe src="stuff.html">Sorry but you need I.E. to see this floating frame.</iframe>

  • name=

Gives the frame a unique name. This works the same way it does for the standard frames.

<iframe src="frame.html" name="cool"></iframe>

  • width=, height=, hspace=, vspace=, align=

These attributes work the exact same way as they do for the <img> tag.

Here is my main page, index.html, loaded into a floating frame.

<iframe src="index.html" name="first" width="550" height="400">You need I.E. to see this frame.</iframe>

Now the following is a link that will change the contents of the previous floating frame:

<a href="reference.html" target="first">Click to jump to my reference.</a>

Click to jump to my reference. (DO NOT click this link if you aren't using I.E. 3 or greater!)




Inserts an image. Sounds easy enough, but this is one of the most complicated tags. With 16 attributes, getting the image placed just right can be no easy task. For most uses, however, it can be easy. It all depends on what you want to do.

  • src=

    Specifies the URL of the image to be displayed.

    <img src="smhtml.gif">

  • align=

    Specifies the alignment of the image. This attribute MUST be used if you wish text to wrap around the image. To make text wrap, you place the image tag BEFORE the first line of text to wrap. Possible values for align= are left, right, top, texttop, middle, absmiddle, bottom, absbottom, and baseline. For examples of all these, go here.

    <img src="smhtml.gif" align="right">

    To get an image to be in the center of the page, you must use <center>.

  • alt=

    Specifies alternative text to be rendered by non-graphical browsers. An example would be Lynx. If an image is essential to site navigation, include the alt= attribute. If the graphic is decorative and non-essential, leave it out.

    <img src="image.gif" alt="I'm an image">

    I'm an image

    Since the image "image.gif" doesn't exist in my directory, you should see "I'm an image" instead. This all depends on what browser you are using.

  • border=

    Specifies the width of a border surrounding the image. If you specify a border size, Netscape and Internet Explorer 4.0 will display as wished. Internet Explorer 3.x, however, will only display the border if the image is a link. Setting this attribute to 0, you can turn off that annoying blue border when an image is a link.

    <img src="smhtml.gif" border="10">
    <img src="smhtml.gif" border="0">

    If you are using Internet Explorer 3.x, you should see no border around either image. If you are using Netscape or I.E. 4, you should see a border around the first image and no border around the second.

  • ismap

    Specifies that the image is a server side image map. Used in combination with <a href=>. Try my image map below by clicking on each letter.

    <a href="">
    <img src="smhtml.gif" border="0" ismap></a>

    The example above is an example for Geocities members. You would substitute your own neighborhood, address, and map name for SiliconValley/6763/ If you aren't a Geocities member, find out if your server supports imagemaps and use their directions.

  • width=
  • height=

    Specifies the horizontal width and the vertical height of the image respectively. If you use width and height to specify the image's exact dimensions, you can enable the browser to display the text before it loads the images. This can give the appearance of a faster download.

    <img src="smhtml.gif" width="74" height="16">

    If you specify the width and not the height, or vise-versa, the browser will automatically scale the image to keep the original aspect ratio the same.

    <img src="smhtml.gif" width="100">

    To stretch or squash the image, you must use both the width and the height.

    <img src="smhtml.gif" width="400" height="25">
    <img src="smhtml.gif" width="80" height="75">

  • hspace=

    Specifies the horizontal space to be left around the image. (in pixels)

    <img src="smhtml.gif" align=absmiddle hspace=15>This text if 15 pixels away from the image.

    This text is 15 pixels away from the image.

  • vspace=

    Specifies the vertical space to be left around the image. (in pixels)

    <img src="smhtml.gif" vspace=10><br>There are 10 pixels between the image and this line.

    There are 10 pixels between the image and this line.

  • lowsrc=

    Specifies the path of a low resolution image. This is used in combination with src. The image that is specified using src is a high resolution version of the image specified using lowsrc. When the document is first loaded, the lowsrc image is displayed. When the document and all of its images are fully loaded, the browser then loads the src image and places it in the same spot as the lowsrc image.

    <img src="smhtml.gif" lowsrc="lowhtml.gif>

  • usemap=

    Specifies the location within the current document of the client-side image map to be used with this image. Usemap can be used with <a> and ismap to allow the image map to be used by browsers who don't support client-side image maps. Since client-side image maps are located within the document, an # is needed before the name of the map. The map's name is specified using the name attribute of the <map> tag.

    <map name="html csim">
    <area shape="rect" coords="0,0,18,16" href="h.html">
    <area shape="rect" coords="18,0,37,16" href="t.html">
    <area shape="rect" coords="37,0,61,16" href="m.html">
    <area shape="rect" coords="61,0,74,16" href="l.html">
    <img src="smhtml.gif" usemap="#html csim">

    The image below results from the code above. It is a working CSIM (Client-Side Image Map). You can try it by clicking on the different letters. If your browser doesn't support CSIMs, it won't work.

    smhtml.gif (1277 bytes)

    I hope to have a CSIM tutorial on these pages within the next month or two.

  • vrml=

    Specifies a VRML (Virtual Realty Modeling Language)"world" to be displayed.

    <img src="image.gif" vrml="world.wrl">

    If the client is using Internet Explorer with the VRML add-on, they would see the VRML world "world.wrl". If the client isn't using Internet Explorer or doesn't have the VRML add-on, the client would see the image "image.gif"

  • dynsrc=

    DYNamic SouRCe. Specifies a movie clip to be displayed.

    <img src="image.gif" dynsrc="movie.avi">

    If the client has I.E., then they would see "movie.avi" playing. If not, they would see "image.gif"

    The following attributes can only be used if a dynsrc is specified.

  • controls

    If specified, a set of controls for the movie will be displayed under it.

    <img src="image.gif" dynsrc="movie.avi" controls>

  • loop=

    Specifies the number of times the movie will play once activated. If loop=infinite or loop=-1, the movie will loop indefinitely.

    <img src="image.gif" dynsrc="movie.avi" loop=3>

  • start=

    Specifies when the movie should start. Values are fileopen - the movie will play when the file is done loading (default), mouseover - will play when the mouse is moved over the movie, or fileopen, mouseover - both.

    <img src="image.gif" dynsrc="movie.avi" start="mouseover">
    <img src="image.gif" dynsrc="movie.avi" start="fileopen, mouseover">

  I.E. Netscape
<img> X X
   ...src= X X
   ...align= X X X X
   ...alt= X X
   ...border= X X
   ...ismap= X X
   ...width= X X
   ...height= X X
  I.E. Netscape
   ...hspace= X X
   ...vspace= X X
   ...lowsrc= X X
   ...usemap= X X
   ...vrml= X  
   ...dynsrc= X  
   ...controls X  
   ...loop= X  
   ...start= X  

HTML Reference
| Tags A | Tags B | Tags C | Tags D | Tags E-G |
| Tags H-K | Tags L-N | Tags O-R | Tags S | Tags T | Tags U-Z |

Created & Managed With Microsoft Frontpage 98 Best experienced with Mirosoft Internet Explorer Counter by Webcounter
Web Tracker Designed with Derekware HTML Author. Free Speech NOW!

1996-1999 Gilpo All rights reserved. This document may not be altered in anyway or distributed without the expressed written consent of Gilpo. All information contained herein is deemed to be accurate but is not warranted.