txban.gif (6549 bytes)



mimilinks.gif (11311 bytes)


 

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"> TexasCook.Com </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="../index.html"> Our Band Site</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 <A NAME="whatever">. The link will look like
<A HREF="#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:<A HREF="url" TARGET="_blank">.

To include a picture in your page, you use a slightly different link.
<IMG SRC="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 TexasCook.Com

<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 HREF="http://www.TexasCook.Com"><IMG SRC="texas100x100.gif">
</A>

Now, here's a hot tip. You can get rid of that colored border by using
<IMG SRC="picture" BORDER=0>
. It can turn links like this:

<A HREF="HTMLMenu.html"><IMG SRC="texas68x50.gif"> </A>

Into links like this:

<A HREF="HTMLMenu.html"><IMG SRC="texas68x50.gif" BORDER=0>
</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.

Return to the Menu

Resume the Lesson (Back Up)

Select Another TexasCook Destination Here

All Sites Listed are Associates of TxCk Family


Page Design By