Czasem semantyka to za mało. Kiedy chcesz po prostu zgrupować elementy, żeby je potem poukładać lub pokolorować, sięgasz po dwa uniwersalne kontenery: <div> (blokowy) i <span>(liniowy). To najważniejsze „cegły” w budowaniu układu strony pod CSS.
Kluczowe zagadnienia:
- Tag
<div>(element blokowy). - Tag
<span>(element liniowy). - Różnica w zachowaniu (nowa linia vs wiersz).
- Przygotowanie pod stylowanie.
Pytania do filmu:
- Jaki jest najbardziej uniwersalny kontener w HTML? (Odp:
<div>). - Czy
<div>ma jakieś znaczenie semantyczne dla Google? (Odp: Nie, jest neutralny). - Czy
<div>łamie linię (zaczyna się od nowej linii)? (Odp: Tak, jest blokowy). - Do czego służy
<span>? (Odp: Do stylowania fragmentów tekstu). - Czy
<span>łamie linię? (Odp: Nie, jest liniowy). - Jaki tag użyjesz, żeby pokolorować jedno słowo w zdaniu? (Odp:
<span>). - Jaki tag użyjesz, żeby zgrupować nagłówek i akapit w jedną ramkę? (Odp:
<div>). - Czy można włożyć
<div>do środka<span>? (Odp: Zazwyczaj nie, odwrotnie tak). - Dlaczego używamy divów, skoro mamy semantykę? (Odp: Do układu/layoutu/grupowania).
- Który z tych tagów jest „workiem” na większe sekcje? (Odp:
<div>).