Kwalifikacje w Zawodzie - Testy zawodowe online | Egzaminy Zawodowe

KWALIFIKACJA PGF7 - TEST WIEDZY NR 9



PYTANIE NR 31.
<table>
  <tr>
    <th>Nazwa produktu</th>
    <th>Cena</th>
  </tr>
  <tr>
    <td>Produkt A</td>
    <td>100 zł</td>
  </tr>
  <tr>
    <td>Produkt B</td>
    <td>200 zł</td>
  </tr>
</table>
Powyższy kod HTML tworzy tabelę z informacjami o produktach. Jakie z poniższych stwierdzeń jest prawdziwe?
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
Fragment HTML zawiera komplet znaczników potrzebnych do zbudowania tabeli: <table> z wierszami (<tr>) i komórkami (<th>, <td>).
Przeglądarka potrafi wyrenderować taki fragment nawet bez pełnego szkieletu dokumentu, a brak CSS oznacza tylko brak dodatkowego stylowania (pozostają style domyślne).

Pełne wyjaśnienie:

Podany kod tworzy tabelę HTML, ponieważ zawiera podstawowe elementy tabelaryczne:

  • <table> – kontener całej tabeli,
  • <tr> – wiersze tabeli,
  • <th> – komórki nagłówkowe (zwykle domyślnie pogrubione i wyśrodkowane),
  • <td> – zwykłe komórki danych.

Z tego powodu tabela będzie wyświetlana (wyrenderowana) przez przeglądarkę. Natomiast w kodzie nie ma żadnych reguł CSS (ani w atrybucie style, ani w osobnym arkuszu), więc tabela nie otrzyma dodatkowego, zaprojektowanego wyglądu. Oznacza to zwykle "surowy" wygląd oparty o domyślne style przeglądarki (tzw. user agent stylesheet).

Dlaczego pozostałe odpowiedzi są nieprawidłowe?

  • Brak <html>: w pełnym dokumencie to element nadrzędny, ale przeglądarki są tolerancyjne i potrafią poprawnie sparsować oraz wyświetlić fragment HTML, uzupełniając brakujące elementy struktury.
  • Brak <body>: podobnie, jest częścią typowego szkieletu dokumentu, ale brak tego znacznika w samym fragmencie nie musi blokować renderowania tabeli; parser może go domyślnie wstawić.
  • Brak <head>: <head> służy m.in. do metadanych, tytułu, linkowania CSS/JS; jego brak nie oznacza, że elementy treści (np. tabela) nie mogą się wyświetlić.

Wskazówka egzaminacyjna: rozróżniaj poprawne renderowanie HTML od stylowania CSS. HTML opisuje strukturę (np. tabela i jej komórki), a CSS odpowiada za wygląd (np. obramowania, kolory, odstępy). Brak CSS nie "psuje" HTML – tylko ogranicza kontrolę nad prezentacją.

Dodatkowe pytania

Dodatkowe pytania (FAQ):
Co robią znaczniki <tr>, <th> i <td> w tabeli HTML?
<tr> tworzy wiersz tabeli, <th> oznacza komórkę nagłówka (np. nazwy kolumn), a <td> to komórka danych (wartości). Poprawne użycie tych znaczników decyduje o strukturze i czytelności tabeli.
Czy tabela HTML zadziała bez dodania CSS?
Tak. HTML odpowiada za strukturę, więc tabela się wyświetli. Bez CSS zobaczysz jednak wygląd domyślny przeglądarki (często bez obramowań i bez "ładnego" formatowania). CSS dodaje m.in. ramki, kolory, odstępy i wyrównania.
Dlaczego brak <html> nie zawsze psuje wyświetlanie w przeglądarce?
Przeglądarki są zaprojektowane tak, by wyświetlać także nieidealny kod. Parser HTML potrafi domyślnie wstawić brakujące elementy struktury dokumentu, aby wyrenderować treść. To nie znaczy, że warto je pomijać w projekcie produkcyjnym.
Co oznacza, że przeglądarka ma "domyślne style" dla HTML?
Każda przeglądarka ma własny arkusz stylów (tzw. user agent stylesheet), który nadaje podstawowy wygląd elementom HTML. Dzięki temu np. nagłówki są większe, a <th> bywa pogrubione. CSS autora strony może te style nadpisać.
Jak dodać proste obramowanie do tabeli z produktami?
Dodaj reguły CSS, np. dla tabeli i komórek. Najczęściej ustawia się obramowanie dla <table>, <th> i <td> oraz łączy krawędzie. Efekt: czytelny cennik/porównanie produktów na stronie reklamowej.
Jakie są najczęstsze błędy w tabelach HTML na egzaminie?
Typowe pomyłki to: mylenie <th> z <td>, brak domknięć znaczników, złe zagnieżdżenie wierszy (<tr> poza <table>) oraz przekonanie, że bez <head> lub <body> "nic się nie wyświetli". Warto testować kod w przeglądarce.
Czy <head> jest potrzebny, aby wyświetlić tabelę na stronie?
Do samego wyrenderowania tabeli wystarczy poprawna struktura elementów tabeli. <head> jest jednak ważny w praktyce, bo tam dodaje się m.in. tytuł strony, metadane oraz link do CSS i skryptów. Pomijanie <head> utrudnia tworzenie kompletnej strony.
Jak odróżnić błąd HTML od braku stylowania CSS w tabeli?
Gdy HTML jest błędny, struktura może się "rozjechać" (np. brakujące komórki, zła liczba kolumn). Gdy brakuje CSS, tabela zwykle jest poprawna, ale wygląda prosto (brak ramek, kolorów, odstępów). Pomaga użycie narzędzi deweloperskich w przeglądarce.
Kiedy w przekazie reklamowym warto użyć tabeli HTML?
Tabela sprawdza się, gdy prezentujesz dane porównawcze: cenniki, warianty produktu, parametry lub zestawienia usług. W reklamie online zwiększa czytelność oferty. Trzeba jednak dbać o responsywność i nie używać tabel do samego układu strony.
Jak przygotować się do pytań o HTML na PGF.7?
Ćwicz rozpoznawanie roli znaczników (np. <table>, <tr>, <th>, <td>), rozumienie różnicy HTML vs CSS oraz testuj krótkie fragmenty kodu w przeglądarce. Na egzaminie często punktuje umiejętność przewidzenia, co się wyświetli i dlaczego.
info

To pytanie poprawnie rozwiązuje 59% zdających egzamin. średnie

Źródła:

  • MDN Web Docs: "HTML table basics" (sekcje o table/tr/th/td) https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Structuring_content/HTML_table_basics - accessed 2026-02-26
  • MDN Web Docs: "&lt;table&gt;: The Table element" https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table - accessed 2026-02-26
  • WHATWG HTML Living Standard: "The table element" https://html.spec.whatwg.org/multipage/tables.html#the-table-element - accessed 2026-02-26

Materiały:

  • Dokumentacja MDN: podstawy tabel HTML i znaczniki &lt;table&gt;, &lt;tr&gt;, &lt;th&gt;, &lt;td&gt;
  • Dokumentacja MDN: struktura dokumentu HTML i rola &lt;head&gt;/&lt;body&gt;
  • WHATWG HTML Living Standard (sekcje o parserze i elementach tabeli)
Zobacz też:

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego