A A A A Search :
MageeMarsh.com       (birding Lake Erie's sw shoreline)
Headings
Block-level
Inline
Lists
Tables
Presentational markup
Links and anchors
Images
Others
References

HTML Reference

Headings

<h1>...</h1> through <h6>...</h6>
Section headings at different levels. Use <h1> for the highest-level heading (the major sections), <h2> for the next level down (sub-section), <h3> for a level below that, and so on. The lowest level heading is <h6>.

Block-level

<p>...</p>
Creates a paragraph. In HTML the closing tag is optional.

<blockquote>...</blockquote>
Creates a block quotation; conventionally displayed indented, but not designed for indenting text. May have automatically generated quotation marks. The cite attribute may give the source, and must be a fully qualified URL.

<pre>...</pre>
Creates pre-formatted text. Text will be displayed in a non-proportional font exactly as it is laid out in the file (see ASCII art).

<address>...</address>
Used to markup contact information for the document or a section of it.

Inline

<em>...</em>
<strong>...</strong>
Emphasis (conventionally displayed in italics) and strong emphasis (conventionally displayed bold). An aural user agent may use different voices for emphasis.

<q>...</q>
A short inline quotation. This should be rendered with generated quote marks. Quotes may be nested, in which case quote marks should be correct for the document language. The cite attribute gives the source, and must be a fully qualified URL.

<cite>...</cite>
A citation. Reference for a quote or statement in the document.

<code>...</code>
A code snippet. Conventionally rendered in a monospace font: Code snippet.

<del>...</del>
Deleted text. Typically rendered as a strikethrough: Deleted text.

<ins>...</ins>
Inserted text. Often used to markup replacement text for <del>'d text. Typically rendered underlined: Inserted text.

Lists

<dl>...</dl>
Creates a definition list (consisting of definition terms paired with definitions). Can also be used to specify speakers and quoted text.

<dt>...</dt>
Creates a definition term.
<dd>...</dd>
Creates a definition.

<ol>...</ol>
<ul>...</ul>
Creates an ordered (enumerated) or unordered (bulleted) list. With ol, the type attribute can be used to specify the kind of ordering, The default is Arabic numbering. For ul, the default marker is a disc.

<li>...</li>
Creates a list item in ordered and unordered lists.

Example of ordered or enumerated list:

<ol>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>

Produces:

  1. First item
  2. Second item
  3. Third item

Example of unordered or bulleted list:

<ul>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ul>

Produces:

Tables

<table>...</table>
Creates a table
<tr>...</tr>
Creates a row in the table.

<th>...</th>
Creates a table header cell within a row; contents are conventionally displayed bold and centered. An aural user agent may use a louder voice for these items.
<td>...</td>
Creates a table data cell within a row.

<caption>...</caption>
used to provide a short description of a table, much like an image caption. By default, most visual browsers render the <caption> element centered above the table.

Example:

<table width="75%" border="1"  cellspacing="0" cellpadding="0">
 <caption>Table 1: Testing the HTML table commands</caption>
 <tr>
  <th>heading one</th>
  <th>heading two</th>
  <th>heading three</th>
 </tr>
 <tr>
  <td align="center">Row one col one</td>
  <td align="right">Row one col two</td>
  <td>Row one col three</td>
 </tr>
 <tr>
  <td>Row two col one</td>
  <td>Row two col two</td>
  <td>Row two col three</td>
 </tr>
</table>

Produces:


Table 1: Testing the HTML table commands
heading one heading two heading three
Row one col one Row one col two Row one col three
Row two col one Row two col two Row two col three

Here's a good article for creating HTML tables.


Presentational markup

<b>...</b>
Use boldface type.

<i>...</i>
Use italic type.

<big>...</big>
Creates bigger text.

<small>...</small>
Creates smaller text.

<tt>...</tt>
Use a typewriter-like (fixed-width) font.

<font [color=color,] [size=size,] [face=face]> </font> (deprecated)
Can specify the font color with the color attribute, typeface with the face attribute, and absolute or relative size with the size attribute.

Examples:

1. <font color="green">text</font> creates green text.
2. <font color="#1f4099">text</font> creates text with hexadecimal color #1f4099.
3. <font size="4">text</font> creates text with size 4. Sizes are from 1 to 7. The standard size is 3, unless otherwise specified in the <body> or other tags.
4. <font size="+1">text</font> creates text with size 1 bigger than the standard.. <font size="-1">text</font> is opposite.
5. <font face="Courier">text</font> makes text with Courier font.

Links and anchors

<a>...</a>
Creates an element that becomes a hyperlink with the href attribute set to a URL; additionally the attribute title may be set to a hover box text, some informative text about the link:

<a href="URI" title="additional information">link label</a>
In most graphical browsers, when the cursor hovers over the link, the cursor typically changes into a hand with a stretched index finger and the additional information pops up, not in a regular window, but in a special "hover box", usually similar to a Tooltip, which disappears when the cursor is moved away. Some browsers render alt text the same way, though this is technically incorrect.
Alternatively (and sometimes concurrently), the element becomes an anchor with the name attribute set, which preceded by a number sign '#' in the URL acts as a link target (a "document fragment"), typically scrolling directly to that point of the page. Any element can be made into an anchor by using the id attribute, so using <a name="foo"> is not necessary.

Example:

<a class="extlink" href="http://www.mageemarsh.com" title="Birdwatching along southwest Lake Erie">Magee Marsh</a>

Images

<img>
Includes an image with the src attribute. Alt is intended as alternative text, although many browsers render it as a tooltip; the title attribute is the tooltip text.

Example:

<img src="http://www.maggeemarsh.com/images/somepic.jpg" alt="Image a of a bird">

Others

<br>

<!-- ... -->
Encloses a comment. This is an SGML tag and not limited to HTML, so it may appear anywhere in the document, even before the DTD or after </html>. A client should render none of its enclosed contents. The closing ">" is required. For compatibility with some pre-1995 browsers, SGML comments are sometimes used inside <style> or <script> tags, but this is not necessary and may in fact cause undesired effects.

References

HTML Element article at Wikipedia

updated on Feb 01, 2006 at 08:34:51 am     Comments: 0

print      source      versions      backlinks