Arachnophilia Tutorial 
LESSON III

[BOOK] PLEASE SIGN THE GUESTBOOK

LINKS AND IMAGE LINKS

Basic Links
  • Basic links are pretty simple. Once again remember, you must tell the browser the path to the html file just like you do image files. If the file is in the same folder as the document being viewed, you can just type the filename in the link tag. The safest thing to do is type in the full path to the file such as
    <a href="http://www.yoursite.com/page2.html">Page 2</a>. This is how it would look; Page 2

  • I know, text links are pretty boring but they are needed for indexes and including links in lines of text. If you want to include something of interest that is on another site but don't want to take your viewer away from your site, simply add target="new" to the link tag and the link will open in a new window.
    <a href="http://www.yoursite.com/page2.html" target="new">Page 2</a>.

    Image Links

  • Image links are basicly the same as text links except you replace the text with an image html tag the same way we added an image earlier. Simply replace Page 2 with the image code between the link tags.
    <a href="http://www.yoursite.com/page2.html" target="new"><img src="yourimage.jpg"></a>.
    You may want to add the tag border="0" to the end of the image tag so you don't get that ugly blue border around the image. <img src="yourimage.jpg" border="0"> Below is an example

    click me

    PAGE DIVIDERS

    The <HR> Tag

  • There are a number of ways to divide the different segments of your page. You can use a graphics to seperate one area from another. This however, is going to slow down load speed. The most simple way to seperate or divide your page is to use a simple html command. Enter the <HR> tag! If you simply type <HR> where you want the division to be a line will be drawn across the page like the blue line above and below.
  • You can also control how thick the line is by adding a height tag. Ex:<HR height="3"> The one I'm using has a height of "3".
  • By adding a width tag you can make the line only as long as you want it to be.
    Ex:<HR height="3" width="350"> This line would have a height of three and a thickness of 350 pixles.
  • Insert a color tag and you can make it whatever color you like. You can use plain text or the numbered colors from the color chart from lesson one. Ex: <HR height="3" width="350" color="red">
  • Thats all there is to making a divider Remember to use the center tags if you designate a width or your line will be on the left side of the page.

    LISTS

    Lists are pretty simple but can be used for a number of things like links and an index. there's nothing trickey about them just copy the code below and modify it for your needs.

    Bulleted Lists
    <UL>
    <LI>One
    <LI>Two
    <LI>Three
    </UL>
    • One
    • Two
    • Three
    Numbered Lists
    <OL>
    <LI>One
    <LI>Two
    <LI>Three
    </OL>
    1. One
    2. Two
    3. Three

    Home | Page 2 | Page 3 | Page 4 | Page 5 | Page 6 | Page 7