If you already know how to turn "pre-formatted" text mode on and off in HTML, and when and why to use it, you can skip this lesson.
One of the features of HTML I find most useful is implemented using the 'PREformatted text' tag pair. Sometimes (heck, often), you want to include text in your web page, that already exists in a separate text file. Along with the text itself, you want to maintain the layout of the text, including all the line breaks and spaces and tabs (careful, now! what's a tab?).
As you no doubt recall, however, the receiving browser ignores whitespace in the HTML file, inserting a maximum of one "space" for each series of whitespace. Carriage returns (end-of-line actions) are also ignored, since they are treated much like whitespace. If this were not true, we wouldn't need the '<BR>' tag or the '&nbsp;' special character. That's where the 'PREformatted text' tag pair comes in; it basicly says to the browser "hey! we're gonna take care of whitespace and line-breaks now, so STOP ignoring them"
The 'PREformatted text' tag pair allows us to insert the text without having to manually insert a '<BR>' tag at the end of each line, and without having to inserts zillions of '&nbsp;'s to get indentation, etc. The tag pair for PREformatted text is:
<PRE></PRE>
Let's see how this might be applied:
Here's a dashingly impressive poem: <PRE> There once was a weirdo named 'Maddog' who couldn't keep gas in his roadhog; when he started to pass, he ran out of gas and went the rest of the way using egg nog. </PRE> and here's the classic "Hello World" 'C++' program" <PRE> // copyright 1997 (just kidding...) #include &lt;iostream.h&gt; main( ) { cout << "Hello World" << endl; } </PRE>
Here's a dashingly impressive poem:
There once was a weirdo named 'Maddog' who couldn't keep gas in his roadhog; when he started to pass, he ran out of gas and went the rest of the way using egg nog.and here's the classic "Hello World" 'C++' program"
// copyright 1997 (just kidding...) #include <iostream.h> main( ) { cout << "Hello World" << endl; }
There are several important things to notice here. First, fixed-spaced fonts are used inside the 'PREformat' tags. Secondly, the <PRE> opening tag causes an automatic double end-of-line action (like a paragraph, and the </PRE> closing tag does the same, thereby automatically setting-off the pre-formatted text. Last, but most certainly not least, no explicit line-breaks or non-breaking space characters were required to get the layout we intended.
While some consider the fixed-font to be a little harsh on the eyes, it is still quite readable, and the ease of entering text inside the <PRE></PRE> tag pair offsets any minor aesthetic concerns.