Co to jest element <pre>?
Element HTML <pre> służy do wyświetlania tekstu preformatowanego, czyli takiego, w którym przeglądarka zachowuje spacje, tabulatory i znaki końca linii wpisane w kodzie źródłowym. Domyślnie treść w tym znaczniku jest prezentowana czcionką o stałej szerokości (monospace).
To właśnie dlatego poprawna odpowiedź w pytaniu egzaminacyjnym brzmi: treści czcionką o stałej szerokości. Warto jednak pamiętać, że najważniejszą cechą <pre> jest zachowanie formatowania tekstu, a nie sama czcionka.
Cechy elementu <pre>
- zachowuje białe znaki (spacje, tabulatory)
- zachowuje podziały wierszy
- zwykle używa czcionki monospace
- nadaje się do prezentacji kodu, logów, ASCII art
Przykład użycia
<pre>
Linia 1
Linia 2 z wcięciem
Linia 3
</pre>
Przeglądarka wyświetli tekst dokładnie z zachowaniem odstępów i przejść do nowej linii.
Typowe zastosowania
Element <pre> stosuje się, gdy ważny jest układ tekstu, na przykład:
- fragmenty kodu programu
- konfiguracje plików
- komunikaty z konsoli
- dane tekstowe wymagające wyrównania
Często łączy się go ze znacznikiem <code>:
<pre><code>for (let i = 0; i < 3; i++) {
console.log(i);
}</code></pre>
<pre> a zwykły tekst
W zwykłym elemencie, np. <p>, wiele spacji jest redukowanych do jednej, a znaki końca linii nie są zachowywane. W <pre> przeglądarka pokazuje tekst niemal dokładnie tak, jak zapisano go w HTML.
Na co uważać?
<pre>nie służy do zmiany kroju pisma na „polską czcionkę”- nie oznacza przekreślenia ani wielokropka
- do wyglądu tekstu nadal można użyć CSS, np.
font-family
Podsumowanie
Element <pre> w HTML służy do prezentacji tekstu preformatowanego, zwykle wyświetlanego czcionką o stałej szerokości. Jest przydatny wszędzie tam, gdzie układ spacji i wierszy ma znaczenie.