HTML Quick Reference

The HyperText Markup Language (HTML) is composed of a set of elements that define a document and guide its display. This document presents a concise reference guide to HTML, listing the most commonly used elements from Versions 1 and 2 of HTML, and giving a brief description of those elements.

Users should be aware that HTML is an evolving language, and different World-Wide Web browsers may recognize slightly different sets of HTML elements. For general information about HTML including plans for new versions, see http://www.w3.org/html/.

UPDATE: the latest version of HTML as on Dec 2015 is HTML5, which is more than just a Markup Language -- it is touted as a platform for building websites, taking over functions like video and sound so that HTML5 pages will (ideally) produce the same results on all browsers. Many of the old HTML tags have been "deprecated" in favor of the more powerful ones in HTML5; but so far most browsers still render the deprecated tags as well.

Introduction

An HTML element may include a name, some attributes and some text or hypertext, and will appear in an HTML document as

<tag_name> text </tag_name>
<tag_name attribute_name=argument> text </tag_name>, or just
<tag_name>
For example:
<center> text </center>
<a href="argument"> text </a>
<p align="center"> text </p>

Text Elements

<p> . . . </p>
The beginning . . . and end of a paragraph that will be formatted before it is displayed on the screen. The align="center" attribute, if included as in the example above, will center-justify the text until </p> ends the paragraph. The text is left-justified by default.
<pre> . . . </pre>
Identifies text that has already been formatted (preformatted) by some other system and must be displayed as is. Preformatted text may include embedded tags, but not all tag types are permitted. (The <pre> tag can be used to include tables in documents, but <table> . . . </table> and associated tags are better.)
<listing> . . . </listing>
Example computer listing; embedded tags will be ignored, but embedded tabs will work. This is an archaic tag.
<xmp> . . . </xmp>
Similar to <pre> except no embedded tags will be recognized.
<plaintext>
Similar to <pre> except no embedded tags will be recognized, and since there is no end tag, the remainder of the document will be rendered as plain text. This is an archaic tag. Note that some browsers actually recognize a </plaintext> tag, even though it is not defined by the standard.
<blockquote> . . . </blockquote>
Include a section of text quoted from some other source.

Logical Styles

<em> . . . </em>
Emphasis
<strong> . . . </strong>
Stronger emphasis
<code> . . . </code>
Display an HTML directive
<samp> . . . </samp>
Include sample output
<kbd> . . . </kbd>
Display a keyboard key
<var> . . . </var>
Define a variable
<dfn> . . . </dfn>
Display a definition (not widely supported)
<cite> . . . </cite>
Display a citation

Physical Styles

<b> . . . </b>
Boldface
<i> . . . </i>
Italics
<u> . . . </u>
Underline
<tt> . . . </tt>
Typewriter font

Hyperlinks or Anchors

<a name="anchor_name"> . . . </a>
Define a target location in a document
<a href="#anchor_name"> . . . </a>
Link to a location in the base document, which is the document containing the anchor tag itself, unless a base tag has been specified.
<a href="URL"> . . . </a>
Link to another file or resource
<a href="URL#anchor_name"> . . . </a>
Link to a target location in another document
<a href="URL?search_word+search_word"> . . . </a>
Send a search string to a server. Different servers may interpret the search string differently. In the case of word-oriented search engines, multiple search words might be specified by separating individual words with a plus sign (+).
An anchor must include a name or href attribute, and may include both. There are several optional attributes, but they are rarely encountered.

The structure of a Uniform Resource Locator (URL) may be expressed as:

resource_type:additional_information
where the possible resource types include: file, http, news, gopher, telnet, ftp, and wais, among others, and each resource type relates to a specific server type. Since each server performs a unique function, each resource type requires different additional_information. For example http and gopher URLs will have a structure like:
resource_type://host.domain:port/pathname
The colon followed by an integer TCP port number is optional, and is used when a server is listening on a non-standard port.

Strictly speaking, the anchor_name and search_word information included in the name and href attributes in the examples above are part of the URL. They are presented as separate entities for simplicity. A more complete description of URLs is presented in http://www.w3.org/Addressing/.

Definition list/glossary: <dl>

<dl>
<dt> First term to be defined
<dd> Definition of first term
<dt> Next term to be defined
<dd> Next definition
</dl>
The <dl> attribute compact can be used to generate a definition list requiring less space.

Present an unordered list: <ul>

<ul>
<li> First item in the list
<li> Next item in the list
</ul>

Present an ordered list: <ol>

<ol>
<li> First item in the list
<li> Next item in the list
</ol>

Entities

&keyword;
Display a particular character identified by a special keyword. For example the entity &micro; specifies the Greek letter "mu" ( µ ), the entity &amp; specifies the ampersand ( & ) and the entities &lt; and &gt; specify the less than ( < ) and greater than ( > ) characters, respectively. Note that the semicolon following the keyword is required, and the keyword must be one from the lists presented in
http://www.w3.org/pub/WWW/MarkUp/html-spec/html-spec_9.html#SEC9.7
&#ascii_equivalent;
Use a character literally. Again note that the semicolon following the ASCII numeric value ascii_equivalent is required.
See SpecialChars.html for a complete list of special numerical codes.

Miscellaneous

<!-- text -->
Place a comment in the HTML source
<address> . . . </address>
Present address information
<img src="URL" alt="Alternate Text">
Embed a graphic image in the document. Attributes:
src
Specifies the location of the image.
alt
Allows a text string to be put in place of the image in clients that cannot display images.
align
Specify a relationship to surrounding text. The argument for align can be one of top, middle, or bottom.
ismap
If ismap is present and the image tag is within an anchor, the image will become a "clickable image". The pixel coordinates of the cursor will be appended to the URL specified in the anchor if the user clicks within the ismap image. The resulting URL will take the form "URL?m,n" where m and n are integer coordinates, and the URL will specify the location of a program that will examine the pixel coordinates, and return an appropriate document.
<br>
Forces a line break immediately and retains the same style.
<hr>
Places a horizontal rule or separator between sections of text.

Additional Information

For a tutorial introduction to HTML(5) see: http://www.w3schools.com/html/ or one of the many more informal HTML tutorials, such as http://www.htmlprimer.com/ or http://www.whoishostingthis.com/resources/html-for-beginners/.

Again, for general information about HTML, see http://www.w3.org/html/.