Phrase elements and font style elements OR logical and physical tags

Below are examples of the common character-formatting tags. Divided into two groups; Physical tags and Logical tags. The appearance of HTML text formatted with physical character-attribute tags is more likely to remain constant from one browser to another, much like the direct formatting you would apply to text in a word processor eg. bold. The appearance of HTML text formatted with logical character-attribute tags, however, depends upon the browser's interpretation of that logical character-attribute tag, much like a style in a word processor.

The idea behind logical styles is that they can be rendered in the best way for that particular platform. For example, if you want to emphasize a word, <em> might produce italics in a browser, but on a text-to-speech system, it could be rendered by shouting!

This is how the tags display by default on your browser. Of course, you can override them using CSS, which is what I've done on the other pages on this site. So to be able to display this page I had to ditch my common stylesheet!

Physical Tags

Physical Tags should not vary from browser to browser.

<b>...</b> - Bold

The quick brown fox jumped over the lazy dog! 0123456789

<I>...</I> - Italic

The quick brown fox jumped over the lazy dog! 0123456789

<U>...</U> - Underscore (deprecated under HTML 4.0)

The quick brown fox jumped over the lazy dog! 0123456789

<TT>...</TT> - Creates typewriter (fixed-width) font.

The quick brown fox jumped over the lazy dog! 0123456789

<S>...</S> - Strikeout (deprecated under HTML 4.0)

The quick brown fox jumped over the lazy dog! 0123456789

<DFN>...</DFN> - Definition, marks defining (first) occurrence of term.

The quick brown fox jumped over the lazy dog! 0123456789

<BLINK>...</BLINK> - Blinking text (Netscape specific)

The quick brown fox jumped over the lazy dog! 0123456789


Logical Tags

Logical tags denote areas as being of a certain style and could be rendered differently according to the platform being used.

<Hn>...</Hn> - Heading (1..6)

h1 - The quick brown fox jumped over the lazy dog! 0123456789

h2 - The quick brown fox jumped over the lazy dog! 0123456789

h3 - The quick brown fox jumped over the lazy dog! 0123456789

h4 - The quick brown fox jumped over the lazy dog! 0123456789

h5 - The quick brown fox jumped over the lazy dog! 0123456789
h6 - The quick brown fox jumped over the lazy dog! 0123456789

<EM>...</EM> - Emphasis (usually italic)

The quick brown fox jumped over the lazy dog! 0123456789

<STRONG>...</STRONG> - Strong (usually bold)

The quick brown fox jumped over the lazy dog! 0123456789

<ADDRESS>...</ADDRESS> - Encloses information about the author and the document (usually italic)

The quick brown fox jumped over the lazy dog! 0123456789

<CODE>...</CODE> - Marks a piece of computer source code and is often displayed in a fixed-width font.

The quick brown fox jumped over the lazy dog! 0123456789

<KBD>...</KBD> - Shows an example of keyboard entry or user input.

The quick brown fox jumped over the lazy dog! 0123456789

<SAMP>...</SAMP> - Shows literal characters, such as computer output.

The quick brown fox jumped over the lazy dog! 0123456789

<CITE>...</CITE> - Marks a citation of a book, article, movie, and so on and is often displayed in italics.

The quick brown fox jumped over the lazy dog! 0123456789

<BIG>...</BIG> - Makes text one size larger.

The quick brown fox jumped over the lazy dog! 0123456789

<SMALL>...</SMALL> - Makes text one size smaller.

The quick brown fox jumped over the lazy dog! 0123456789

<SUP>...</SUP> - Renders text as superscript.

The quick brown fox jumped over the lazy dog! 0123456789

<SUB>...</SUB> - Renders text as subscript.

The quick brown fox jumped over the lazy dog! 0123456789

<ABBR>...</ABBR> - Logically denotes abbreviations and acronyms.

The quick brown fox jumped over the lazy dog! 0123456789

<Q>...</Q> - Denotes a short inline quotation.

The quick brown fox jumped over the lazy dog! 0123456789

<VAR>...</VAR> - Shows the name of a variable. Often displayed as italic.

The quick brown fox jumped over the lazy dog! 0123456789

<DEL>...</DEL> - Indicates that text has been deleted from the current revision. MSIE Only. (See <INS>)

The quick brown fox jumped over the lazy dog! 0123456789

<INS>...</INS> - Indicates that text has been inserted in the document since the last revision. MSIE Only. (See <DEL>)

The quick brown fox jumped over the lazy dog! 0123456789