KWALIFIKACJA INF3 - STYCZEŃ 2019

PYTANIE NR 6.
Przy użyciu jakiego znacznika w HTML otrzymamy tekst napisany czcionką o stałej szerokości znaku, który uwzględnia dodatkowe spacje, tabulacje i znaki końca linii?
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
Znacznik <pre> służy do prezentacji tekstu preformatowanego: przeglądarka zachowuje spacje, tabulacje oraz znaki końca linii dokładnie tak, jak w kodzie źródłowym. Dzięki temu nadaje się do logów i bloków tekstu z wcięciami. Pozostałe znaczniki nie zapewniają takiego zachowania białych znaków.

Pełne wyjaśnienie:

W HTML domyślnie przeglądarka koliduje białe znaki (np. wiele spacji zamienia na jedną) i nie traktuje znaków nowej linii w źródle jako wymuszonego złamania wiersza. Jeśli jednak trzeba pokazać tekst dokładnie w takim układzie, w jakim został zapisany (ze spacjami, tabulatorami i końcami linii), stosuje się element <pre>.

Dlaczego <pre> jest poprawne?
<pre> to element preformatowania: zachowuje białe znaki i łamanie linii, a w praktyce zwykle jest renderowany czcionką o stałej szerokości (monotypową). To czyni go właściwym wyborem do prezentacji np. fragmentów konfiguracji, wyników poleceń w terminalu czy logów.

Dlaczego pozostałe odpowiedzi są błędne?

  • <ins> oznacza wstawiony fragment treści (np. zmiana w dokumencie). Nie służy do zachowywania układu białych znaków ani do preformatowania.
  • <code> opisuje semantycznie fragment kodu. Sam znacznik nie gwarantuje zachowania tabulatorów i końców linii; do bloków kodu zwykle łączy się go z <pre> (np. <pre><code>...</code></pre>), aby zachować formatowanie.
  • <blockquote> służy do oznaczania dłuższego cytatu blokowego. To element semantyczny dla cytatów, a nie narzędzie do wiernego odwzorowania spacji i nowych linii.

Wskazówka egzaminacyjna: jeśli w treści pytania pojawia się wymaganie "uwzględnia dodatkowe spacje, tabulacje i znaki końca linii", szukaj odpowiedzi związanej z preformatowaniem — w HTML jest to właśnie <pre>.

Dodatkowe pytania

Dodatkowe pytania (FAQ):
Element <pre> służy do wyświetlania tekstu preformatowanego, czyli takiego, w którym przeglądarka zachowuje spacje, tabulacje i znaki nowej linii. Najczęściej używa się go do logów, wyników poleceń lub bloków tekstu z wcięciami.
Bo jego celem jest prezentacja treści w formie "jak w źródle". W przeciwieństwie do zwykłych akapitów, w <pre> białe znaki nie są redukowane, a znaki końca linii są traktowane jako podział wierszy. To ułatwia czytelny zapis tekstu z układem.
Nie. <code> opisuje semantycznie fragment kodu (często renderowany monospace), ale sam nie zapewnia zachowania końców linii i tabulatorów jak blok. Jeśli potrzebujesz wiernego układu, zwykle łączy się <code> z <pre>.
Najczęściej: prezentacja konfiguracji, logów, wyników terminala oraz fragmentów kodu, gdzie ważne są wcięcia i podziały wierszy. W dokumentacji technicznej pozwala to uniknąć "rozjechania" formatowania, które pojawia się w zwykłym tekście HTML.
<blockquote> służy do oznaczania dłuższych cytatów blokowych (semantyka cytowania). Nie jest elementem preformatowania, więc nie jest wyborem do zachowania tabulacji, wielu spacji i znaków końca linii. Może zmieniać wygląd cytatu, ale nie ma celu "wiernego układu".
<ins> oznacza fragment tekstu wstawiony (np. w porównywaniu wersji dokumentu lub przy oznaczaniu zmian). To znacznik semantyczny związany z edycją treści, a nie z preformatowaniem. Nie służy do zachowania spacji, tabulatorów ani łamań wiersza.
Semantyka pyta: "co ten fragment oznacza?" (np. cytat, wstawienie, kod). Renderowanie pyta: "jak to się wyświetli?" (np. zachowanie białych znaków). W tym zadaniu kluczowe są spacje/tabulacje/nowe linie, więc chodzi o renderowanie i preformatowanie.
<br> wymusza pojedyncze złamanie wiersza, ale nie rozwiązuje problemu wielu spacji i tabulatorów w dłuższym bloku tekstu. <pre> działa "hurtowo": zachowuje cały układ (spacje, tabulacje, nowe linie) bez wstawiania wielu ręcznych <br>.
Najczęstszy błąd to wybór <code> tylko dlatego, że kojarzy się z czcionką monospace. W pytaniu kluczowe jest jednak zachowanie białych znaków i końców linii. Drugi błąd to mylenie elementów semantycznych (<blockquote>, <ins>) z elementami wpływającymi na układ tekstu.
Przećwicz różnice między zwykłym tekstem a preformatowaniem: wpisz ten sam tekst do <p>, <code> i <pre> i porównaj efekt. Zapamiętaj też, że HTML domyślnie redukuje białe znaki, a wyjątkiem w takim kontekście jest <pre>.
info

Statystycznie 56% uczniów zna prawidłową odpowiedź. średnie

Eksperci podkreślają: "Znacznik &lt;pre&gt; służy do prezentacji tekstu preformatowanego: przeglądarka zachowuje spacje, tabulacje oraz znaki końca linii dokładnie tak, jak w kodzie źródłowym."

Źródła:

  • WHATWG HTML Living Standard – The pre element, https://html.spec.whatwg.org/multipage/grouping-content.html#the-pre-element - accessed 2026-02-18
  • MDN Web Docs – &lt;pre&gt;: The Preformatted Text element, https://developer.mozilla.org/en-US/docs/Web/HTML/Element/pre - accessed 2026-02-18
  • MDN Web Docs – &lt;code&gt;: The Inline Code element, https://developer.mozilla.org/en-US/docs/Web/HTML/Element/code - accessed 2026-02-18

Materiały:

  • Dokumentacja WHATWG HTML (opis elementu pre)
  • MDN Web Docs: element &lt;pre&gt; i zasady białych znaków w HTML/CSS
  • Ćwiczenia praktyczne: porównanie renderowania tekstu w &lt;p&gt;, &lt;code&gt; i &lt;pre&gt;

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego