Podstawy•LEKCJA 12 / 22

Nagłówki tabel i scope

Kurs HTML · Wyjaśnienie, przykłady, oczekiwany wynik i ćwiczenie.

<th> oznacza nagłówek wiersza lub kolumny.

Cel lekcji

Poznać zagadnienie „Nagłówki tabel i scope”, zrozumieć przykład i umieć zastosować podobny zapis we własnym programie.

Wyjaśnienie krok po kroku

Atrybut scope="col" pomaga powiązać go z komórkami danych i ułatwia korzystanie z tabeli czytnikom ekranu.

Najpierw przeanalizuj kod bez uruchamiania. Zwróć uwagę, jakie dane wykorzystuje program, co z nimi robi i skąd bierze się wynik pokazany pod przykładem.

Praktyczny przykład

Gdzie zobaczysz efekt: Widok w przeglądarce

<table>
  <tr><th scope="col">Imię</th><th scope="col">Punkty</th></tr>
  <tr><td>Ola</td><td>20</td></tr>
</table>

Przeczytaj kod linijka po linijce

  1. <table>Ten znacznik określa element lub strukturę dokumentu.
  2. <tr><th scope="col">Imię</th><th scope="col">Punkty</th></tr>Ten znacznik określa element lub strukturę dokumentu.
  3. <tr><td>Ola</td><td>20</td></tr>Ten znacznik określa element lub strukturę dokumentu.
Oczekiwany wynik / efektpo uruchomieniu przykładu
Tabela z nagłówkami Imię i Punkty oraz jednym wierszem.
◉Podgląd w przeglądarceHTML/CSS — bez uruchamiania skryptów

Jak utrwalić tę umiejętność?

Przepisz kod samodzielnie. Następnie zmień jedną wartość lub jedną instrukcję i spróbuj przewidzieć efekt. Dopiero potem uruchom zmienioną wersję. Jeśli wynik jest inny niż oczekiwany, porównaj kolejne linie.

Spróbuj samodzielnie

Dodaj drugi wiersz tabeli.

To już koniec tej lekcji.

Jeśli rozumiesz przykład, oznacz lekcję jako ukończoną i przejdź dalej.