HTML Tags

Tag
Definition and Attributes

<A></A>

Either HREF or NAME is mandatory

 

 

 

 The A tag is used for links and anchors. The tags go on either side of the link like this: <A HREF="aURL">the link </A
HREF

If the link is to another page HREF is set equal to the URL of that page:

<A HREF="http://www.cnn.com"> CNN </A>

If the link is an anchor HREF is set equal to the pound sign followed by the name of the anchor:

<A HREF=#AnchorName> to the anchor</A>
NAME

If the NAME attribute is included instead of the HREF attribute then the A tag is being used to mark a spot in the page that can later be pointed to by a link. In this case the </A> tag immediately follows the opening tag:

<A NAME=ANCHORNAME></A>

<B></B>

The B tag makes the text between <B> and </B> bold:

<B>This text will be BOLD.</B>

<BLINK></BLINK>

The B tag makes the text between <BLINK> and </BLINK> blink:

<BLINK>This text will blink.</BLINK>

<BODY></BODY>

All attributes are optional.

 

 The BODY tag surrounds all the content of your site. It allows you to set the look and feel of your site through its attributes.
TEXT

The TEXT attribute allows you to set the color of the text:

<BODY TEXT=red>

A page with that body will have red text.
BGCOLOR

The BGCOLOR attribute allows you to set the color of the background:

<BODY BGCOLOR=blue>

A page with that body will have a blue background.
BACKGROUND

The BACKGROUND attribute allows you to set an image as the background:

<BODY BACKGROUND=monkey.jpg>

A page with that body will have a monkey for a background (if there was an image monkey.jpg in the same folder as it).

<BR>

 The BR tag inserts a line break in the page.

<CENTER></CENTER>

 The CENTER tags align the text between them in the center of the page

<FONT></FONT>

All attributes are optional

 The FONT tags allow you to set the color and size of a specific piece of text. Unlike the BODY tag the FONT tag only changes the text between the opening <FONT> and closing </FONT> tag.
COLOR

The COLOR attribute allows you to set the color of the text:

<FONT Color=red>Red Text </FONT>
SIZE

The SIZE attribute allows you to set the size of the text:

<FONT SIZE=6>Big Text </FONT>

<FORM></FORM>

The FORM tags must surround all elements of a form. The opening <FORM> tag has two attributes method and action.

<H1></H1> through <H6></H6>

The header tags: H1, H2,H3,H4,H5,H6, make the text between their opening and closing tags bold and large. H1 is the largest and H6 is the smallest.

<H3>Big Bold Text</H3>

<H1>Bigger Bold Text</H1>

<HEAD></HEAD>

 The HEAD tag surrounds information about the page.

<HTML></HTML>

 The HTML tags must surround the entire page.

<I></I>

The I tag makes the text between <I> and </I> italic:

<I>This text will be Italic.</I>

<IMG>

SRC is mandatory

 

 This tag is used to insert an image into a page. The image is displayed where the <IMG> tag is inserted.
SRC

The SRC tag tells the browser what image to insert.

<IMG SRC=monkey.jpg>

Would insert the image of the monkey.
WIDTH The width tag tells the browser what the dimensions of the image should be. If the dimensions of the image are different than what is given the browser stretches the image to make it fit.
HEIGHT The height tag tells the browser what the dimensions of the image should be. If the dimensions of the image are different than what is given the browser stretches the image to make it fit.

<INPUT>

 

NAME and TYPE are required.

 The input tag is used to insert a form element into a form. It must go between the <FORM> and </FORM> tags.
NAME The NAME attribute is used to determine what information came from what form element. In the case of radio buttons all the buttons in a set must have the same name.
TYPE

This attribute Tells the browser what type of form element to insert.

<INPUT TYPE = "text" > will be a text field.

<INPUT TYPE = "checkbox"> will be a checkbox.

<INPUT TYPE = "radio"> will be a radio button.

<INPUT TYPE = "reset"> will be a reset button.

<INPUT TYPE = "submit"> will be a submit button.
SIZE This attribute defines how big the element will be.
VALUE

This attribute defines what the element will be set to. For example:

<INPUT TYPE = "text" NAME="email" SIZE=15 VALUE="type name here">

Will create a text field with the words "type name here" in it by default.

<LI>

The LI tag creates a new element in an ordered or unordered list.

<OL>
<LI>element one.
<LI>element two.
</OL>

<OL></OL>

 The OL tags start and end an ordered list. All of the elements in the list must be inside these two tags.

<OPTION>

The OPTION tag creates a new option for the selection box it is contained in.

<SELECT NAME="gender">
<OPTION> Male
<OPTION> Female
<OPTION> Undecided
</SELECT>

Will create a selection box with three options.

<P>

 The P tag starts a new paragraph by putting a double line break into the page.

<SCRIPT></SCRIPT>

The LANGUAGE attribute is mandatory

The Script tag lets you use scripting languages such as Javascript in a web page. In our case LANGUAGE will always be set equal to "Javascript."

<SCRIPT LANGUAGE="Javascript">The Script Goes Here</SCRIPT>

The contents of the script must go between these two tags.

<SELECT></SELECT>

The SELECT tag will create a selection box within a form. The SELECT element must have at least one OPTION tag within it:

<SELECT NAME="gender">
<OPTION> Male
<OPTION> Female
<OPTION> Undecided
</SELECT>

<TABLE>

All attributes are optional

 

 

 

 

 The TABLE tag must surround an entire table. It's attributes determine how the table looks.
BORDER This defines how big the borders of a table will be.
CELLPADDING This defines how far from the edge of a cell the content in that cell will be
CELLSPACING This defines how far apart the cells of the table will be.
WIDTH This defines the width of the table
BGCOLOR This defines the background color of the table. If a color is specified in the TR or TD tags BGCOLOR is ignored for that row, or cell respectively.

<TD></TD>

All attributes are optional

 The TD tag surrounds the contents of a cell within a table. Every TD tag must be within the <TABLE> and </TABLE> tags.
ALIGN

This determines how the content in the cell is aligned.

<TD ALIGN=RIGHT> will make the cell right justified

<TD ALIGN=CENTER> will make the cell centered

<TD ALIGN=LEFT> will make the cell left justified
VALIGN

This determines where the content in the cell is placed

<TD VALIGN=TOP> will place the content at the top of the cell.

<TD VALIGN=MIDDLE> will place the content in the middle of the cell.

<TD VALIGN=BOTTOM> will place the content at the bottom of the cell.

 
BGCOLOR The BGCOLOR attribute controls the background color of this cell. As with the BGCOLOR attribute in the <TABLE> tag, BGCOLOR can only be assigned a built-in color or RGB value (e.g. BGCOLOR="blue"). If no BGCOLOR is specified, the cell will have the same background color as the row.
ROWSPAN ROWSPAN controls how many rows the cell occupies, allowing you to merge the cells of three rows into one tall cell. The default is 1, but you can increase this attribute to be anything up to the number of remaining rows. For example, ROWSPAN=3 will cause the cell to be 3 rows high.

When you have set a cell to occupy more than one row, you will usually be filling fewer cells in the next few rows. If, for example, you set ROWSPAN=4 on one cell in a table that is 5 columns wide, the next 3 rows would have 4 columns to fill instead of 5.

COLSPAN COLSPAN controls how many columns the cell occupies, allowing you to merge the cells of three columns into one long cell. The default is 1, but you can increase this attribute to be anything (if you raise it above the number of remaining columns, it will create new ones on the right). For example, COLSPAN=3 will cause the cell to be 3 columns long.

<TEXTAREA></TEXTAREA>

 

 

 

 The TEXTAREA tag creates a text area within a form
NAME The NAME attribute is used to determine what information came from what form element.
ROWS This defines how many rows of text will fit in the text area.
COLS This defines how many columns of text will fit into the text area.

<TITLE></TITLE>

The TITLE tag must go between the <HEAD> and </HEAD> tags. The title of the page is placed between the <TITLE> and </TITLE> tags:

<TITLE> THE TITLE GOES HERE</TITLE>

<TR></TR>

 

 

 

  
ALIGN

This determines how the content in all the cells in this row is aligned. It is used the same way the TD ALIGN attribute is.
VALIGN This determines how the content in all the cells in this row is vertically aligned. It is used the same way the TD VALIGN attribute is.
BGCOLOR The BGCOLOR attribute controls the default background color of every cell in the row. As with the BGCOLOR attribute in the <TABLE> tag, BGCOLOR can only be assigned a built-in color or RGB value (e.g. BGCOLOR="blue"). If no BGCOLOR is specified, the row will have the same background color as the table.

<TT></TT>

The B tag makes the text between <TT> and </TT> fixed width:

<TT>This text will be fixed width.</TT>

<U></U>

The U tag makes the text between <U> and </U> underlined:

<U>This text will be underlined.</U>

<UL></UL>

 The UL tags start and end an unordered list. All of the elements in the list must be inside these two tags.