Without links, the World Wide Web wouldn't be a web at all! To add a link... you will use the opening tag and closing tag. Whatever appears between these two tags will
become underlined and colored, and if you click on the underlined text it will send the browser
to the location within the quotes.
Example of a link
Visit Dave's Site!
-----------------------------------------------------------------------------------------------
If you are just linking to a page in the same directory as your current page, you don't need the
domain, just the page name. If you have a page called contactme.html, you can use the code Contact Me.
Note: Although links are usually used to send people to other web pages, you may also use links
to send email to a specific address by using a location of mailto:user@host.
Example of a Mailto: Link...
Send email to the Author [Dave]!
------------------------------------------------------------------------------------------------
Example of a basic in-line image...
If your image is in the same directory as your HTML file, just use the image name. If your file
is welcome.jpg, you can use Then add the appropriate height, width, and
alt attributes as mentioned above
------------------------------------------------------------------------------------------------
Many times you may want to have an image that is linked, so that if someone clicks the image,
the person will be taken to another page. This is rather simple- you just need to place the IMG
tag within the A HREF tags. () You
may also use the ALIGN tags with images!
Example of a linked image...
if you want the image to be linked without the colored link border, add border="0". Example:
-----------------------------------------------------------------------------------------------
The center tag pretty much explains itself! The opening center tag is
and the closing
center tag is . Whatever you put between will be centered on the current line!
Example of CENTER tag
Center Works!!!
-----------------------------------------------------------------------------------------------
In Chapter 1 you learned the BODY tag. The BODY tag has many attributes... here are the most
useful ones...
BACKGROUND="location_of_image" - Background image for web page. Example: If you have kitten.jpg
in the same directory as your HTML file, use
to load it as your
background image.
BGCOLOR="#hexadecimal_here" - Hexadecimal Color Code for Background Color
LINK="#hexadecimal_here" - Hexadecimal Color Code for Links (if left blank, most browsers
default to blue.)
VLINK="#hexadecimal_here" - Hexadecimal Color Code for Links the User has Already Visited (if
left blank, most browsers default to purple.)
TEXT="#hexadecimal_here" - Hexadecimal Color Code for Text Color
Click Here to Learn how to use the Hexadecimal Color System
If you are looking for special effects such as links without an underline, or links that change
color when you move the mouse over them, you need to use CSS (Cascading Style Sheets) with your
HTML code.
Red Green Blue
#FF0000 #00FF00 #0000FF
-----------------------------------------------------------------------------------------------
If you want to be able to have the text start at the top next to the image, you must use the
ALIGN attribute... example:
Here is an image
Isn't it cool?
What are tables used for?
Tables are used to make data easier to interpret or to just give your document more impact.
this is a big image.
What are tables used for? |
Tables are used to make data easier to interpret or to just
give your document more impact. |
Tables are one of the most challenging things to code with HTML. It isn't very hard, it just
takes a while to get the hang of. Tables start with the tag, and usually contain the
border="n" attribute within the opening tag. If the border="0", than the table's border is
invisible. Usually when you do not use the border attribute the table border will become
invisible. This is useful when you want to align text in rows and columns, but don't want a
table border around it. border="1" is a thin border. border="2" is a little thicker, border="3"
a little more thick.. and so on. The table MUST end with a
tag, or the table might not
appear at all!
Example of tables with borders...
This table has a border of 0
This table has aborder of 3. |
Each row within the table is defined by the opening tag and the optional
closing tag.
Within each table row are table cells, which are defined by the opening and | closing
tags. Most table rows contain more than one cell. Many times, you will need a heading for a
column of cells of the first row. To do this, you will use the opening and | closing
tag. The table heading tag makes the text in that cell BOLD and CENTERED. You only need use the
heading cells when necessary.
Example of a table with multiple rows and columns
Heading A | Heading B | Heading C |
Cell A | Cell B | Cell C |
Cell D | Cell E | Cell F |
But what if you want your table to look like the following?
Heading A | Heading B | Heading C |
Cell A & D | Cell B | Cell C |
Cell E | Cell F |
Notice how the rowspan="2" attribute was added. This allows that cell to span two rows. If you
want a cell to span more than column, use the colspan="n" attribute. Also, you may wish to use
the ALIGN and VALIGN attributes to align the contents of cells. If you wish to change the
horizontal alignment of the contents of a certain cell, add align="left", align="center", or
align="right" to the opening tag. If you wish to change the vertical alignment of the
contents of a cell, use the valign="top", valign="middle", or valign="bottom" attributes. You
may also want to try out the width="n%" attribute, to change the width of a table or a cell.
Example of ALIGN attributes within a table..
Left Alignment |
Center Alignment |
Right Alignment |
|