HFCC Web Design and Development Club
HTML / XHTML Tag Reference Guide
Structure Tags
<html></html>
Creates an HTML document. First and last line of every HTML web page file.
<head></head>
Contains web page title in browser window title bar and other information that isn't displayed on the Web page itself, such as meta tags for search engines.
<title></title>
Puts the name of the document in the title bar
<body></body>
Begins and ends the visible portion of the document.
<div></div>
Used with CSS to name and define a division, or section of your web site. Once named, the formatting and location of the section can be defined.
<!-- -->
Adds a non-visual comment in HTML file. Will not be seen on web page. Used to document a web page for the developer.
<span>
Used with CSS to create an inline style. That is, to apply formatting to a tag, such as the font face and size of a paragraph. Div is said to be block-level, span is said to be element-level.
Formatting Tags
<p></p>
Creates a new paragraph.
<br />
Line break. Drops text to next line (versus adding a blank line that <p>< does).
<blockquote></blockquote>
Indents text to both sides. Good for blocks of text under a heading.
<p></p>
Creates a paragraph.
<h1> </h1>
Creates the largest headline.
<h6> /h6>
Creates the smallest headline.
<b> </b>
Creates bold-face text.
<i> </i>
Creates italic text.
<tt> </tt>
Creates teletype, or typewriter-style text.
<cite> </cite>
Creates a citation, usually italic.
<em> </em>
Emphasizes a word (with italic or bold).
<strong> </strong>
Emphasizes a word (with italic or bold).
<dl> </dl>
Creates a definition list
<dt> </dt>
Precedes each definition term (close tag so it is XHTML compliant).
<dd> </dd>
Precedes each definition (close tag so it is XHTML compliant).
<ol> </ol>
These tags surround a numbered (ordered) list.
<ul> </ul>
These tags surround a bulleted (unordered) list.
<li> </li>
These tags are used within a numbered or bulleted list for each line.
Link Tags
<a href="URL"> </a>
Creates a hyperlink.
<a href="mailto:EMAIL"> </a>
Creates a mailto link.
<a name="NAME"> </a>
Creates a target location within a document.
<a href="#NAME"> </a>
Links to that target location from elsewhere in the document.
Graphical and Multimedia Tags
<img src="name" />
Adds an image.
<hr />
Inserts a horizontal rule.
<hr size=? />
Sets size (height) of rule.
<hr width=? />
Sets width of rule, in percentage or absolute value.
<hr noshade />
Creates a rule without a shadow.
* The size, width and noshade attributes above have been deprecated and should be done with CSS now.
Table Tags
<table></table>
Creates a table.
<tr></tr>
Sets off each row in a table.
<td></td>
Sets off each cell in a row.
<th></th>
Sets off the table header (a normal cell with bold, centered text).
Form Tags
<form></form>
Used to begin and end the form.
<input type=text name="fname" size=20 /></p>
Creates a one-line text area. Size sets length, in characters..
<select name="NAME"></select>
Creates a pull-down menu.
<option></option>
Used for each item in the pull-down menu.
<textarea name="NAME" cols=40 rows=8></textarea>
Creates a text box area. Columns set the width; rows set the height..
<input type="checkbox" name="NAME" />
Creates a checkbox. Text follows tag.
<input type="radio" name="NAME" value="x" />
Creates a radio button. Text follows tag.
<select multiple name="NAME" size=?></select>
Creates a scrolling menu. Size sets the number of menu items visible before you need to scroll.
<input type="submit" value="NAME" />
Creates a Submit button.
<input type="image" border=0 name="NAME" src="name.gif" />
Creates a Submit button using an image.
<input type="reset" />
Creates a Reset button.
Deprecated Tags
Deprecated tags are those from older versions of HTML that should not be used anymore and have been replaced by newer, better techniques.
<font size=?> </font>
and <font color=?> </font>CSS should be used to provide font size and color now.
<center> </center>
Centering should be done with CSS now.
For example: <div style="text-align:center">
<applet> </applet>
The following should be used instead of applet: <object> </object>