.format1 { … } W języku CSS zapisano wspólne formatowanie dla pewnej grupy znaczników. Formatowanie takich znaczników w kodzie HTML nastąpi przez...
.format1 { … }W języku CSS zapisano wspólne formatowanie dla pewnej grupy znaczników. Formatowanie takich znaczników w kodzie HTML nastąpi przez atrybut
A. div = "format1"
B. class = "format1"
C. style = "format1"
D. id = "format1"
Pytanie z egzaminu CKE, czerwiec 2022 (arkusz E.14-SG-22.06).
Selektor .format1 w CSS oznacza klasę, czyli wspólny zestaw reguł, który można przypisać do wielu elementów HTML przez atrybut class="format1". Kropka jest używana tylko w arkuszu CSS, np. .format1 { color: red; font-weight: bold; }, ale w HTML wpisuje się samą nazwę klasy, bez kropki: <p class="format1">Tekst</p>. To bardzo ważna zasada w praktycznym tworzeniu stron, bo klasy są właśnie po to, żeby wielokrotnie używać tego samego formatowania na różnych znacznikach: akapicie, nagłówku, elemencie listy czy przycisku. Moim zdaniem to jedna z podstaw, która później mocno ułatwia pracę z większym projektem. Dobrą praktyką jest nadawanie klas opisowych, np. class="komunikat-blad" albo class="karta-produktu", zamiast nazw typu class="czerwony", bo wygląd może się zmienić, a rola elementu zostaje. Warto też pamiętać, że jeden element może mieć kilka klas, np. class="format1 aktywny", co pozwala budować style modułowo i czytelnie, zgodnie z typowym podejściem stosowanym w HTML i CSS.
W tym pytaniu łatwo pomylić kilka pojęć, bo w HTML i CSS często występują podobne nazwy, ale pełnią zupełnie inne role. Zapis .format1 w CSS nie oznacza znacznika div ani atrybutu style, tylko selektor klasy. Kropka przed nazwą jest sygnałem dla przeglądarki: znajdź wszystkie elementy, które mają klasę o nazwie format1. Dlatego w kodzie HTML trzeba użyć atrybutu class="format1". Bez tego reguła CSS po prostu nie zostanie dopasowana do elementu. Atrybut style działa inaczej: służy do wpisywania bezpośrednich deklaracji CSS, na przykład style="color: red; margin: 10px;". Nie podaje się tam nazwy gotowej klasy, tylko konkretne właściwości i wartości. To działa, ale przy większych stronach szybko robi się bałagan, dlatego style inline stosuje się raczej ostrożnie. Atrybut id="format1" też nie jest właściwym wyborem, bo id służy do jednoznacznej identyfikacji jednego elementu na stronie, a w CSS odpowiada mu selektor #format1, nie .format1. Jeśli formatowanie ma dotyczyć grupy znaczników, klasa jest naturalnym rozwiązaniem. Z kolei div="format1" nie jest standardowym sposobem przypisywania stylu. div to nazwa elementu HTML, a nie atrybut do podłączania formatowania. Przeglądarka może czasem tolerować dziwne atrybuty, ale to nie znaczy, że jest to poprawny i zgodny ze standardami kod. Z mojego doświadczenia wynika, że najczęstszy błąd bierze się stąd, że ktoś widzi nazwę format1 i próbuje ją wpisać gdziekolwiek w HTML, zamiast skojarzyć kropkę w CSS z atrybutem class.