Normální text dokumentu je zarovnáván podle velikosti okna
prohlížeče a je obvykle zobrazen proporcionálním písmem. Tento
způsob zobrazování je však pro výpisy programů nebo textové tabulky
nevhodný. V těchto případech potřebujeme, aby se text zobrazil
přesně tak, jak je zapsán – aby se zachovaly konce řádků,
všechny mezery a aby text se zobrazil neproporcionálním písmem.
V HTML pro tyto účely nalezneme element pre.
Krátký program v jazyce C, který slouží k výpočtu
faktoriálu, můžeme zapsat takto:
<pre>
#include <stdio.h>
long f (long n) {
return( n==0 ? 1 : n * f(n-1) );
}
main() {
printf("%ld\n", f(10));
}
</pre>

Vidíme, že zápis textu programu mezi tagy <pre> a </pre> je téměř
shodný s výsledkem v prohlížeči. Jediný rozdíl spočívá v nahrazení
znaků menšítka a většítka příslušnými znakovými entitami.
Uvnitř elementu pre můžeme používat elementy
pro změnu typu písma (např. i, b
a u) a rovněž odkazy (<a
...>). Použití různých druhů písma umožňuje v zápisu
zdrojových textů programů použít zvýraznění syntaxe a zlepšit tak
jejich srozumitelnost. Následující kód v HTML:
<pre>
<b>function NSD</b> (A, B: Longint): Longint;
<i>{Funkce vrací největšího společného dělitele čísel A a B.}
{K výpočtu je použit modifikovaný Euklidův algoritmus.}</i>
<b>begin</b>
A:= Abs(A);
B:= Abs(B);
<b>while</b> (A<>0) <b>and</b> (B<>0) <b>do</b>
<b>begin</b>
<b>if</b> A>B <b>then</b> A:= A <b>mod</b> B
<b>else</b> B:= B <b>mod</b> A;
<b>end;</b>
<b>if</b> A=0 <b>then</b> NSD:= B
<b>else</b> NSD:= A;
<b>end;</b>
</pre>
zobrazí v prohlížeči úhledně zformátovaný prográmek:

Samozřejmě, že ruční doplňování tagů do textu programu není zrovna moc pohodlné a rychlé. Tento proces lze naštěstí zautomatizovat – existuje celá plejáda programů, které umějí zvýraznit syntaxi mnoha jazyků a výsledek uložit do HTML. Podobnou funkci umí obstarat i javascriptové knihovny, které lze připojit ke stránce.

