HTML TUTORIAL PART 6: EXPLANATION OF OUTPUT TAGS

PRE is used to include sections of text in which formatting is critical. Unlike in the other HTML containers, text in a PRE pair will only be wrapped at the linebreaks in the source, and spaces will not be collapsed. You can even use tabs, although it is better to use multiple spaces since those will always be the right number.

Text inside this tag will be displayed in a monospaced font to retain the formatting. This is the reason you cannot include font-changing tags inside PRE text. Images are excluded because they can introduce problems with alignment. An image can't be translated to a certain number of characters.

The optional WIDTH attribute can be used to indicate how wide the text is (for example, WIDTH=80 for a typical text file). This would allow the browser to pick a font which fits the entire text in the current window. Unfortunately this isn't very widely supported.

USAGE EXAMPLE:

Code:

<pre>
Text in a pre element
is displayed in a fixed-width
font, and it preserves
both      spaces and
line breaks
</pre>

<p>The pre element is often used to display computer code:</p>
<pre>
#include<iosteam>
using namespace std;

int main()
{
cout<<"This is an example of pre tag in html";
}
</pre>

CODE is used for snippets of code which appear inside a paragraph of text. It is usually rendered in a monospaced font. You can use this tag to mark up things like <CODE>for ( ; ; ) ;</CODE> is a nice way to make an endless loop in C.

For larger blocks of code, use PRE instead. If what you are marking up is what a user should type in, use KBD.

USAGE EXAMPLE:

Code:

<code>I am a Computer code text</code>

The TT tag specifies that the enclosed text should be rendered in a teletype (monospaced) font. This can be used to simulate typewriter output. If possible, use CODE, SAMP or KBD instead. These tags allow the browser to pick a suitable rendering for each specific case, instead of the generic rendering you get with TT. It also makes the job easier for convertors and search robots.

USAGE EXAMPLE:

Code:

<tt>This is how Teletype text looks like!</tt>

KBD is used to indicate text which should be entered by the user. It is often drawn in a monospaced font, although this is not required. It differs from CODE in that CODE indicates code fragments and KBD indicates input.

USAGE EXAMPLE:

Code:

<kbd>This is a Keyboard text</kbd>

VAR is used to mark up variables, for example in discussions of computer programs. Using this tag allows programs to automatically generate lists of the used variables. Example: "The variable <VAR>c</VAR> is used as a counter in this program."

USAGE EXAMPLE:

Code:

<var>I am a variable</var>

DFN is used to mark up terms which are used for the first time. These are often rendered in italics so the user can see this is where the term is used for the first time.

USAGE EXAMPLE:

Code:

<dfn>I am enclosed in a definition tags</dfn>

SAMP is used to indicate a sample of text which should be used literally. For example, "The text <SAMP>General Protection Fault</SAMP> is well known to Windows users."

It differs from KBD text in that KBD text indicates text the user must enter, whereas SAMP text can also be output.

USAGE EXAMPLE:

Code:

<samp>This is a Sample of computer code text</samp>

This tag is officially deprecated. That means that this tag is being phased out, and it is strongly suggested that you not use it.

<XMP> indicates a block of text where all HTML tags are ignored. The only tag that is not ignored is </XMP>.


USAGE EXAMPLE:

Code:

<XMP>
<b><font color='red'> As you can see the output will not be in red color, as all the HTML tags are ignored within this XMP tag</font></b>
</XMP>

-Arvind