Some more advanced HTML tags and what they do

This document is meant to be a guideline and reference. It assumes that you know what HTML is and how to write it. This document is not meant to be a step-by-step tutorial. In many cases, the attributes within a tag are optional. If an attribute has more than one option, those options will be separated by a "|".

<!-- comment -->
A comment. This won't be seen by the browser.
<EMBED SRC="" WIDTH="#" HEIGHT="#">
Used to embed another document (QuickTime, sound, Shockwave, etc.) into a Web page. Each document has its own set of attributes, so check with the manufacturer. These are minimum attributes. SRC is the location of the document; WIDTH and HEIGHT are measured in pixels.

Forms

<FORM METHOD="POST|GET" ACTION=""></FORM>
Contains a form and all form elements within it.
<INPUT TYPE="TEXT|PASSWORD" NAME="" VALUE="" SIZE="#,1" MAXLENGTH="#">
An input area of text (TEXT) or hidden text (PASSWORD); NAME is the chosen name for post processing; VALUE (optional) is an initial value; SIZE is the number of characters long by 1 high; MAXLENGTH is the maximum number of characters allowed.
<INPUT TYPE="RADIO|CHECKBOX" NAME="" VALUE="" CHECKED>
Radio button or checkbox; All radiobuttons with the same NAME on a page are grouped together and only one may be selected; All checkboxes with the same NAME are grouped together but more than one may be selected; CHECKED indicates the default selection.
<INPUT TYPE="HIDDEN|SUBMIT|RESET" NAME="" VALUE="">
HIDDEN types are not seen on the page but pass info to a cgi script; SUBMIT activates the FORM ACTION; RESET clears the form.
<SELECT NAME="" SIZE="#" MULTIPLE></SELECT>
Indicates a list of selections; SIZE of 1 creates a pop-up box where only one option is selected, SIZE greater than 1 gives a scrolling list; MULTIPLE indicates that more than one item in a scrolling list can be selected.
<OPTION VALUE="" SELECTED></OPTION>
Contained inside the SELECT container, these are the possible options; SELECTED is the default selection.
<TEXTAREA NAME="" VALUE="" ROWS="#" COLS="#" WRAP="OFF|VIRTUAL|PHYSICAL"></TEXTAREA>
An input area of more than one line; VALUE (optional) is an initial value; ROWS and COLS is the number of rows and columns, respectively; WRAP sets no wrap, wrapping only on screen, or wrapping both on screen and off, respectively; putting text within the container is equivalent to setting an initial VALUE.

Tables

<TABLE WIDTH="#|%" HEIGHT="#" COLS="#" BORDER="#" CELLSPACING="#" CELLPADDING="#" BGCOLOR="#" BORDERCOLOR="#" ALIGN="LEFT|RIGHT|CENTER"></TABLE>
Table; WIDTH is measured in pixels or percentage; HEIGHT in pixels (optional); COLS is the number of columns; BORDER is the size of the slanted border around the table; CELLSPACING is the space *between* the cells while CELLPADDING is the spacing *within* the cells; BGCOLOR specifies a background color in hexadecimal RGB; BORDERCOLOR specifies color in hexadecimal RGB for the border.
<TR ALIGN="LEFT|RIGHT|CENTER" VALIGN="TOP|CENTER|BOTTOM" BGCOLOR="#"></TR>
Table row; ALIGN and VALIGN are for alignment inside the cell; BGCOLOR establishes a bgcolor for the row, in hexadecimal RGB.
<TD COLSPAN="#" ROWSPAN="#" ALIGN="LEFT|RIGHT|CENTER" VALIGN="TOP|CENTER|BOTTOM" BGCOLOR="#"></TD>
Table cell; COLSPAN and ROWSPAN (optional) are for spanning more than one column or row (NOTE: be careful of the number of columns or rows if using this attribute); ALIGN and VALIGN are for the alignment of whatever is inside the cell; BGCOLOR establishes a bgcolor for the cell, in hexadecimal RGB. TD attributes supercede TR attributes for a particualr cell.

Table cells (within the <TD></TD> containers) can contain all of the previous elements, including those on the previous page.

<META NAME="" KEYWORDS="" HTTP-EQUIV="REFRESH" CONTENT="#; URL=url">
The META tag is always in the HEAD (not BODY) container and has two uses. When the NAME or KEYWORDS attributes are used, it provides information for robots from search engines to find and catalog. When HTTP-EQUIV is used, this creates the "bump" effect to load a new page or other file. Note that CONTENT has only one set of quotes around it, and specifies both the delay in seconds before the bump AND the URL of the new destination, separated by a semicolon.
<FRAMESET ROWS="#,#" COLS="#,#" BORDER="#" FRAMEBORDER="YES|NO" BORDERCOLOR="#"></FRAMESET>
Used to create frames. ROWS or COLS (mutually exclusive) specifies the size of the frames, either in pixels or percentage; BORDER specifies the thickness of the border, in pixels; FRAMEBORDER tells whether the border should appear or not; BORDERCOLOR specifies a hexadecimal RGB color for the border.
<FRAME SRC="" NAME="" SCROLLING="YES|NO|AUTO" NORESIZE MARGINWIDTH="#" MARGINHEIGHT="#" LEFTMARGIN="#" TOPMARGIN="#" BORDERCOLOR="#">
The actual frame you wish to load. SRC is the URL path to that page; Name is the name of the frame (used for TARGETing); SCROLLING indicates whether the frame should include scrollbars, not include them, or only include them if necessary, respectively; NORESIZE, if present, indicates that the frame cannot be resized within the browser window; MARGINWIDTH and MARGINHEIGHT, LEFTMARGIN and TOPMARGIN specify in pixels a margin from the edge of the frame window; BORDERCOLOR specifies a hexadecimal RGB color for the border (superceeds same attribute in FRAMESET).
<NOFRAMES></NOFRAMES>
Use this tag outside the FRAMESET for non-frames capable browsers. This is where the rest of the HTML would go on a page.
All material, including content, images, and code, is © Copyright 1994-2001 Matthew Duhan, except where noted. All Rights Reserved. No unauthorized use or duplication, in whole or part, is permitted without prior written permission.
For international purposes, copyright on material on pages which display the above notice is claimed under the Berne Convention (1971 Paris text) by Matthew Duhan.

Back to FringeNet Tutorials

Fringe Elements | Fringe Benefits | Copyright Infringement | Lunatic Fringe