HTML Reference
Tags
Cursors,
Body,
IFrame,
Tables,
><,
Bold/Italic/Small/etc,
Span,
Preformatted Text,
Blockquote,
Comments,
Status Bar,
Marquee,
Horizontal Rule,
Links,
Images,
Image Map,
Lists,
Special Characters,
Forms
Cursors
top
Body
<body background ="yourimage.gif" bgproperties="fixed">
<body onload="if (self != top) top.location = self.location">
<body bgcolor="#ffffff" topmargin=0 bottommargin=0 leftmargin=0 rightmargin=0>
<body background="starrynight.jpg" bgcolor="#000000" text="#555555" link="#ccccff" vlink="#9999ff"
alink="#ccccff">
<body onMouseOver="window.status='Your text goes here.';return true">
top
IFrame
<iframe src="http://www.yourdomain.com/yourpage.php
" width="590" height="350" hspace="1"
vspace="1"></iframe>
top
Tables
<table border="0" cellpadding="2" align="center" width="50%"><tr><td
background="yourimage.gif"></td></tr></table>
<table border="2" cellpadding="2" cellspacing="2" width="100%" bgcolor="#333333" bordercolor="#666666">
<tr>
<td width="50%" bgcolor="#cccccc">column 1</td>
<td width="50%">column2</td>
</tr>
</table>
top
HTML Decimal Character Codes and Values
- " "
- & &
- < <
- > >
- © ©
- ® ®
-
- ™ ™
- % ‰
- @ @
- $ $
- ö
ö
- ñ
ñ
- è
è
top
Bold, Italic, Underline, Typewriter, Strong, Small, Big
- Bold Text: <b>
- Italic Text: <i>
- Typewriter Text: <tt>
- Strong Text: <strong>
- Small Text: <small>
top
Span
<span style="background-color:red">Your text goes here.</span>
top
Preformatted Text
<pre>
The quick brown fox jumped over the lazy dog.
</pre>
top
Blockquote
<blockquote>
vigorous writing is concise. a sentence should contain no unnecessary words, a paragraph no unnecessary sentences, for the same reason that a drawing should have no unnecessary lines and a machine no unnecessary parts.
--william strunk, jr., 1918
</blockquote>
top
Comments
<!-- your comments here -->
top
Status Bar
<body bgcolor="#002814" text="white" link="yellow" vlink="green" onload="window.status='i am not going to let you see what is in the
status bar!'">
top
Marquee
<marquee bgcolor="#cccccc" loop="-1" scrollamount="2" width="100%">example marquee</marquee>
top
Horizontal Rule
<hr size=4 width="50%" color="#666666">
top
Links
Relative
<a href="../hello.php
">
Title, New Window
<a href="http://www.yourdomain.com/yourpage.php
" title="hello" target="_blank">
Mailto with Subject & Body
<a href="mailto:soandso@yourdomain.com?subject=from yourdomain.com&body=from yourdomain.com">mailto:soandso@yourdomain.com?subject=from yourdomain.com&body=from
yourdomain.com</a>
Within Document
<a name="hello">hello</a> <a href="#hello">go to hello</a>
Status Text
<a href="hello.php
" onmouseover="window.status='hello there'; return true" onmouseout="window.status=";return true">hello there</a>
Highlight
<a href="http://www.yourdomain.com" style="background:yellow; color:black;">
Alert Box
<a href="" onmouseover="alert('your message');return true;"> place link text here</a>
top
Images
<img src="graphic.jpg" border="0" width="100" height="100" align="center" alt="this is my graphic...">
Make Lines with Images
<img src="http://www.yourdomain.com/yourimage.gif" width="200" height="2" border="0">
<img src="http://www.yourdomain.com/yourimage.gif" width="200" height="5" border="0">
<img src="http://www.yourdomain.com/yourimage.gif" width="2" height="200" border="0">
<img src="http://www.yourdomain.com/yourimage.gif" width="5" height="200" border="0">
<img border="0" align="left" src="yourimage.jpg"> your text image displayed on right:
<img border="0" align="right" src="yourimage.jpg"> your text
top
Image Map
<map name="hit7">
<area shape="rect" coords="478,299,549,322" href="http://www.yourdomain.com/yourpage.htm ">
<area shape="rect" coords="472,114,542,137" href="page1.htm" title="title1">
<area shape="rect" coords="475,271,546,294" href="page2.htm" title="title2">
<area shape="rect" coords="473,242,544,265" href="page3.htm" title="title3">
<area shape="rect" coords="483,215,554,237" href="page4.htm" title="title4">
<area shape="rect" coords="472,191,543,214" href="page5.htm" title="title5">
<area shape="rect" coords="469,164,540,187" href="page6.htm" title="title6">
<area shape="rect" coords="472,135,544,158" href="page7.htm" title="title7">
<area shape="rect" coords="472,87,544,110" href="page8.htm" title="title8">
</map>
<img width=701 height=455 border=0 src="http://www.yourdomain.com/yourimage.gif" usemap="#hit7">
top
Lists
Unnumbered, Bulleted List
<ul>
<li> apples
<li> bananas
<li> grapefruit
</ul>
top
Numbered/Ordered List
<ol>
<li> oranges
<li> peaches
<li> grapes
</ol>
top
Definition List
<dl>
<dt> ncsa
<dd> ncsa, the national center for supercomputing
applications, is located on the campus of the
university of illinois at urbana-champaign.
<dt> cornell theory center
<dd> ctc is located on the campus of cornell
university in ithaca, new york.
</dl>
top
Nested List
<ul>
<li> a few new england states:
<ul>
<li> vermont
<li> new hampshire
<li> maine
</ul>
<li> two midwestern states:
<ul>
<li> michigan
<li> indiana
</ul>
</ul>
top
List Styles
<ul style="list-style-type: square">
<li style="list-style-type: circle">
<li style="list-style-type: disc">
<li style="list-style-type: decimal">
<li style="list-style-type: lower-alpha">
<li style="list-style-type: upper-alpha">
<li style="list-style-type: lower-roman">
<li style="list-style-type: upper-roman">
<li style="list-style-image: none">
<li style="list-style-image: url(gif/button3.gif)">
<li style="list-style: url(gif/button3.gif) inside;">
top
Special Characters
| Name |
Code |
Signs |
| Dagger |
† |
† |
| Double
Dagger |
‡ |
‡ |
| Black
spade suit |
♠ |
♠ |
| Black
club suit |
♣ |
♣ |
| Black
heart suit |
&heart; |
♥ |
| Black
diamond suit |
♦ |
♦ |
| Leftward
arrow |
← |
← |
| Upward
arrow |
↑ |
↑ |
| Rightward
arrow |
→ |
→ |
| Downward
arrow |
↓ |
↓ |
| Left
angle quote |
« |
« |
| Right
angle quote |
» |
» |
| Cent
sign |
¢ |
¢ |
| General
currency sign |
¤ |
¤ |
| Yen
sign |
¥ |
¥ |
| Copyright |
© |
© |
| Section
sign |
§ |
§ |
| Paragraph
sign |
¶ |
¶ |
| Micro
sign |
µ |
µ |
| Plus
or minus |
± |
± |
Forms
Email Button
<form><input type="button" value="email me" onclick="location.href='mailto:soandso@yourdomain.com">
top
Drop Down Menutop
Preformatted Forms
<form><pre>
name: <input type="text">
email:<imput type="text">
</pre></form>
top
Customizing Forms
<input type="text" size="10" maxlength="30" value="your text">
<input type="text" style="color: #ffffff; background- color: #72a4d2;" size="10"
maxlength="30">
<input type="hidden">
<input type="image">
<input type="password">
<input type="submit">
<input type="reset">
top
Using an Image for a SubmitButton
<input type=image name="submit" src="yourimage.gif" border="0">
top
Radios and Checkboxes Selected
<input type="radio" name="option1" checked>option 1
<input type="radio" name="option2">option 2
<input type="radio" name="option3">option 3
<input type="checkbox" name="selection1"> selection 1
<input type="checkbox" name="selection2"> selection 2
<input type="checkbox" name="selection3"> selection 3
top
