|
These tables summarizes the basic HTML tags. Click on a particular category of tags to jump directly to it, or browse the full reference list. Note: In older versions of HTML, some tags do not require ending tags (empty tags). I have added an "EMPTY TAG" note by these. With the emergence of XML and XHTML, web designers will need to be sure to include both beginning and ending tags. For now, don't worry about adding these ending tags - just be aware that they exist. |
| Document | Images | Forms |
| Basic Text | Imagemaps | META Tags |
| Lists | Tables | Style Sheets |
| Links | Frames | Special Characters |
| Structure Tags | |||
| Function | Start Tag | Attributes | End Tag |
| HTML File | <html> | none | </html> |
| File Header | <head> | none | </head> |
| File Title | <title> | none | </title> |
| Comments | <!-- | Your comments go between the start and end tags. Put a space between the -- and your comments. | --> |
| Body | <body> | background="filename" bgcolor="color value" text="color value" link="color value" vlink="color value" |
</body> |
| Division | <div> | align="right/left/center" style="property:value;" class="classname" |
</div> |
| Span (inline) | <span> | style="property:value;" class="classname" |
</span> |
| Basic Text Tags | |||
| Function | Start Tag | Attributes | End Tag |
| Line Break | <br> | clear="left/right/all" | EMPTY TAG </br> or <br /> |
| Paragraph | <p> | align="center/right" | </p> |
| Bold | <b> | none | </b> |
| Italic | <i> | none | </i> |
| Typewriter Text | <tt> | none | </tt> |
| Headline | <h1-6> | align="center/right" | </h1-6> |
| Font | <font> | face="name, name" size="+/-value/fixed size" color="color value" Note: the font tag is being phased out in favor of CSS styles. |
</font> |
| Horizontal Rule | <hr> | size="XX" width="XX/XX%" noshade |
EMPTY TAG </hr> or <hr /> |
| Block Quote | <blockquote> | none | </blockquote> |
| Division | <div> | align="left/center/right" | </div> |
| List Tags | |||
| Function | Start Tag | Attributes | End Tag |
| Unordered List | <ul> | type="disc/circle/square" | </ul> |
| Ordered List | <ol> | type="I/A/1/a/i" start="value to start counting at" |
</ol> |
| List Item | <li> | type=all ul and ol options | </li> |
| Definiton List | <dl> | none | </dl> |
| Definition List Item | <dt> | none | </dt> |
| Definition List Definition | <dd> | none | </dd> |
| Link Tags | |||
| Function | Start Tag | Attributes | End Tag |
| Anchor Link | <a> | href="filename" target="windowname" |
</a> |
| Anchor Mark | <a> | name="markname" | </a> |
| Image Tags | |||
| Function | Start Tag | Attributes | End Tag |
| Insert Image | <img> | src="filename" align="left/right" width="XXX" height="XXX" alt="text that desribes image" ISMAP USEMAP="#mapname" border="X" hspace="X" vspace="X" |
EMPTY TAG </img> |
| Client-side Imagemap Tags | |||
| Function | Start Tag | Attributes | End Tag |
| Define Map | <map> | name="mapname" | </map> |
| Area Definition | <area> | shape="rect/circle/poly/point" coords="X,Y,X,Y" href="imagename" |
</area> |
| Table Tags | |||
| Function | Start Tag | Attributes | End Tag |
| Table | <table> | border="X" width="XX/X%" cellspacing="XX" cellpadding="XX" bgcolor="color value" background="filename" |
</table> |
| Table Row | <tr> | align="left/center/right" valign="top/middle/bottom" bgcolor="color value" |
</tr> |
| Table Data | <td> | align="left/center/right"
valign="top/middle/bottom" width=X nowrap colspan="X" rowspan="X" bgcolor="color value" |
</td> |
| Table Header | <th> | align="left/center/right" valign="top/middle/bottom" width=X nowrap colspan="X" rowspan="X" bgcolor="color value" |
</th> |
| Caption | <caption> | align="left/center/right" valign="top/middle/bottom" |
</caption> |
| Frame Tags | |||
| Function | Start Tag | Attributes | End Tag |
| Set Frames | <frameset> | cols="XX/XX%/*" rows="XX/XX%/*" |
</frameset> |
| Frame Definition | <frame> | src="filename" name="framename" noresize scroll=auto/yes/no marginwidth="XX" marginheight="XX" |
</frame> |
| Base | <base> | target="framename"/ "_self"/ "_top"/ "_parent" (Note the underscores) |
</base> |
| No Frames | <noframes> | Between start and end tags, place the content that appears when a non-frames browser loads this page. | </noframes> |
| Form Tags | |||
| Function | Start Tag | Attributes | End Tag |
| Form | <form> | method=get/put action="programname" |
</form> |
| Input Field | <input> | name="variablename" type=text/password/ checkbox/radio/submit/ reset/image |
</input> |
| Selection List | <select> | name="variablename"
size=XX multiple |
</select> |
| Selection Option | <option> | none | </option> |
| Scrolling Text Field | <textarea> | name="variablename" rows=XX cols=XX |
</textarea> |
| Meta Tags | |||
| Function | Start Tag | Attributes | End Tag |
| <meta> (Server metatags) |
http-equiv="refresh" content="seconds, filename" |
none | EMPTY TAG </meta> |
| <meta> (Content metatags) |
name="keywords/description/author/ generator/abstract/expiration" content="your information" |
none | EMPTY TAG </meta> |
| Style Sheet Tags | |||
| Function | Start Tag | Attributes | End Tag |
| Style Definition Area | <style> | type="text/css"> Style declarations go between begin and end style tags |
</style> |
| Link to external CSS File | <link> | rel=stylesheet type="text/css" href="URL" |
none |
| Commonly-Used Special Characters | ||
| Name | Symbol | HTML Equivalent |
| ampersand | & | & |
| cent sign | ¢ | ¢ |
| copyright symbol | © | © or © |
| degree sign | ° | ° |
| greater than | > | > |
| less than | < | < |
| non-breaking space | | |
| registered trademark | ® | ® |
| trademark | ™ | ™ |
Information shamelessless snatched from www.projectcool.com