Teoria INF.03: HTML

Jakie znaczniki tworzą szkielet dokumentu HTML? #

<!DOCTYPE html>, html, head, body

Który znacznik ustawia kodowanie polskich znaków? #

<meta charset="UTF-8"> w sekcji head. Bez tego zamiast ogonków są krzaki.

Jak podpiąć zewnętrzny arkusz stylów? #

<link rel="stylesheet" href="styl.css"> w sekcji head

Wymień znaczniki semantyczne układu strony #

header, nav, main, section, article, aside, footer

Czym różni się section od article? #

section to fragment tematyczny strony. article to treść samodzielna, mająca sens w oderwaniu od strony, np. wpis na blogu.

Jakie atrybuty są wymagane przy znaczniku img? #

src — ścieżka do pliku, oraz alt — opis alternatywny. alt jest sprawdzany i punktowany.

Jak zrobić, żeby komórka tabeli zajęła trzy kolumny? #

<td colspan="3">. Dla wierszy: rowspan.

Do czego służy znacznik caption? #

Do podpisu tabeli. Umieszcza się go bezpośrednio po otwarciu <table>.

Jak powiązać etykietę z polem formularza? #

<label for="imie"> i pole z id="imie". Kliknięcie etykiety ustawia kursor w polu.

Czym różni się metoda GET od POST? #

GET przekazuje dane w pasku adresu — widoczne, ograniczona długość. POST przesyła je w treści żądania — niewidoczne, bez limitu długości.

Które atrybuty walidują pole bez użycia skryptu? #

required, pattern, min, max, maxlength oraz typ pola, np. type="email"

Jak otworzyć odnośnik w nowej karcie? #

<a href="..." target="_blank">

Czym różni się lista ul od ol? #

ul jest nieuporządkowana (punktory), ol uporządkowana (numeracja). Elementy obu to li.

Po co dodaje się znacznik meta viewport? #

Żeby szerokość strony odpowiadała szerokości urządzenia: <meta name="viewport" content="width=device-width, initial-scale=1.0">. Bez niego mobilny układ może wyglądać jak pomniejszona wersja desktopu.

Czym różnią się atrybuty name i id pola formularza? #

name jest kluczem wysyłanym do PHP, a id identyfikuje element w dokumencie i łączy go z label. Pole bez name nie trafi do danych formularza.

Co określa atrybut action formularza? #

Adres pliku lub zasobu, który odbierze dane po wysłaniu formularza, np. <form action="zapis.php" method="post">.

Jak zbudować grupę pól typu radio, w której można wybrać jedną odpowiedź? #

Wszystkie pola muszą mieć ten sam atrybut name, ale różne wartości value. Wspólna nazwa tworzy jedną grupę wyboru.

Jak ustawić domyślnie wybraną opcję listy select? #

Dodaj selected do właściwego znacznika option. Do formularza zostanie wysłana wartość z jego atrybutu value.

Jak musi być skonfigurowany formularz wysyłający plik? #

Potrzebuje method="post" i enctype="multipart/form-data", a pole pliku ma typ file.

Po co w tabeli używa się thead, tbody i tfoot? #

Dzielą tabelę na nagłówek, dane i podsumowanie. Poprawiają semantykę, dostępność oraz ułatwiają osobne stylowanie części tabeli.

Co oznacza atrybut scope w komórce th? #

Wskazuje, czego dotyczy nagłówek: scope="col" dla kolumny albo scope="row" dla wiersza. Pomaga czytnikom ekranu.

Co oznacza ../ w ścieżce względnej? #

Przejście o jeden folder wyżej. Przykład: ../obrazy/logo.png szuka folderu obrazy obok bieżącego katalogu.

Kiedy użyć znaczników figure i figcaption? #

Gdy obraz, wykres albo fragment kodu ma własny podpis. figure grupuje materiał, a figcaption opisuje go semantycznie.

Co robi atrybut lang w znaczniku html? #

Deklaruje język strony: <html lang="pl">. Czytniki ekranu dobierają po nim wymowę, a przeglądarka słownik. Zasady oceniania CKE punktują to osobno.

Czym różni się <br> od nowego akapitu? #

<br> to złamanie wiersza wewnątrz tekstu. Nowy akapit to nowy <p> — ma własne marginesy i jest osobnym blokiem znaczeniowym.

Które znaczniki są puste (nie mają wersji zamykającej)? #

br, hr, img, input, meta, link, source. W HTML5 ukośnik na końcu jest opcjonalny.

Jak zbudować listę uporządkowaną? #

<ol><li>pozycja</li></ol>. Numeracja powstaje sama — nie wpisuje się jej w treść.

Czym różni się ol od ul? #

ol to lista uporządkowana (numerowana), ul nieuporządkowana (punktowana). Obie zawierają wyłącznie li jako bezpośrednie dzieci.

Jak zrobić listę definicji? #

<dl>, w niej pary: <dt> — pojęcie, <dd> — opis. Jedno dt może mieć kilka dd.

Jak zagnieździć listę w liście? #

Podlistę wstawia się WEWNĄTRZ <li>, nie między pozycjami: <li>Owoce<ul><li>jabłko</li></ul></li>.

Znaczniki sekcji HTML5 — który do czego