Finally, we come to the topic of Links. Links are what make an HTML
page be more
than just a text document. Links come in three basic varieties: links to other
files, links to the same file and links to pictures. To link to another file
on another server, use <A HREF="http://server/path/filename.html">
anchor text </A>. This is called absolute linking. The tag is called an anchor.
Example: <A HREF="http://www.texascook.com"> TexasCookdotCom </A>
To link to another file on the same server, use <A
HREF="path/filename.html">
anchor text </A>. That is called relative linking.
Example: <A HREF="/ma/mar1/index.html"> Country Cooking Texas Style</A>
To link to a different place in the same file, you have to do two
things.
First you must leave a pointer to the place in the file you want to link to. The pointer
looks like whatever
">whatever
">
anchor text </A>.
Parts of other pages can be linked to in the same way:
<A HREF="http://server/path/file#whatever
">
Example: <A HREF="#bottom"> Link to the bottom of the page </A>
Links to places in other documents can be done the same way.
<A HREF="Other.html#whatever
"> anchor text </A> will do
it.
Here's a cool trick from HTML 3.0: To have the link displayed in a
new window,
add TARGET="_blank" to your anchor tag like this:
To include a picture in your page, you use a slightly different link.
picture
">picture
can be
a relative or absolute link,
but absolute links are strongly discouraged because of the bandwidth
they eat up. (It's much quicker to access a local drive than to go out over the net for a
picture.)
Here's an example picture from TexasCookdotCom
<IMG SRC="texas100x100.gif">
A thing you will often see is an image as a link. It's easy, just
put the image link in as the anchor text like this:
</A>
Now, here's a hot tip. You can get rid of that colored border by
using picture
" BORDER=0>
</A>
Into links like this:
</A>
Another important feature of images is alternates. In the case that
your image
doesn't load, or if the viewer is using a non-graphical browser, your text alternate
will be displayed.
Alternates are done with <IMG ALT=text ... >. If text contains
any whitespace, it must be enclosed in quotes.
Other interesting things can be done with IMG links.
By using <IMG BORDER=## ... >, with ## equal to a number, a
border
can be added to pictures whether they are anchors or not.
By using <IMG HEIGHT=## WIDTH=## ... >, the height and width of the
image can be controlled. ## is the height or width you want to image
to be. This is useful in formatting.
By using <IMG ALIGN=?????? ... >, a variety of things can be done. ??????
can be one of five things: TOP, MIDDLE, BOTTOM, LEFT or RIGHT.
Default is BOTTOM.
Top Aligned
Middle
Aligned
Bottom Aligned
Left
Aligned
When an image is left aligned, more than one line of text can be placed beside it, and
when there is too much text to fit in the space to the left of the image, it wraps around
below the image. However, there catch is that the left align stay in effect until all the
space to the left of the image has been filled. That means that the next paragraph or
image or whatever followed the left-aligned image may end up formatted completely wrong if
you expand the window of your browser too wide. Also, if you have a long image, you may
not ever be able to fill the space with text since HTML doesn't recognize multiple
whitespace characters. The way around this problem is to use tables (view the source for
my homepage.).
Right
Aligned
Right-aligned images work the same way as left-aligned.
That's it! That's all the basic HTML you need to know to write an
really
impressive homepage. It may seem like a lot, but you should pick it
up pretty quickly once you start using it.
Now Continue on with the Advanced Portions.
**FREE** INCREASE YOUR HITS AND GET 20MB'S OF WEBSPACE! **FREE** |