Feb 26, 2011

HTML Quick Reference Tags Guide

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" </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
</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"
</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 </meta>
<meta>
(Content metatags)
name="keywords/description/author/
generator/abstract/expiration"
content="your information"
none </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 & &amp;
cent sign ¢     &cent;
copyright symbol © &copy; or &#169;
degree sign ° &deg;
greater than > &gt;
less than < &lt;
non-breaking space &nbsp;
registered trademark ® &#174;
trademark
&#153;

0 comments:

Post a Comment