W języku CSS zdefiniowano formatowanie dla stopki:
#stopka { … }Aby użyć tego formatowania dla bloku opisanego znacznikiem
div, należy zapisaćA.
<div title="stopka">
B.
<div id="stopka">
C.
<div class="stopka">
D.
<div "stopka">
Selektor #stopka w CSS oznacza selektor identyfikatora, czyli styl przypisany do elementu mającego atrybut id="stopka". Dlatego zapis dla bloku powinien wyglądać tak: <div id="stopka">. Kratka # w CSS nie jest przypadkowa — zgodnie ze składnią CSS wskazuje właśnie na id elementu, a nie na klasę ani dowolny opis. W praktyce działa to tak, że przeglądarka analizuje strukturę HTML, znajduje element z konkretnym identyfikatorem i stosuje do niego reguły zapisane w #stopka { ... }. Moim zdaniem to jedna z podstawowych rzeczy, które warto sobie dobrze utrwalić, bo później bardzo pomaga przy debugowaniu stylów. Dobra praktyka jest taka, żeby id było unikalne w obrębie dokumentu, czyli na stronie powinien istnieć tylko jeden element z id="stopka". Jeśli stopka ma występować raz, taki zapis jest sensowny. Gdybyśmy chcieli stylować wiele podobnych bloków, lepiej użyć class="stopka" i selektora .stopka. W nowoczesnym HTML często zamiast zwykłego div używa się też znacznika footer, ale zasada z id pozostaje taka sama: footer id="stopka" pasowałby do selektora #stopka.
W tym pytaniu kluczowe jest rozróżnienie między identyfikatorem, klasą i zwykłym atrybutem HTML. Zapis #stopka w CSS nie oznacza tekstu wpisanego gdziekolwiek w znaczniku, tylko konkretnie element z atrybutem id="stopka". Częsty błąd polega na tym, że ktoś widzi nazwę „stopka” i próbuje ją po prostu dopisać do znacznika div, na przykład jako sam napis w cudzysłowie. Taki zapis nie jest poprawnym HTML, bo atrybut musi mieć nazwę oraz ewentualnie wartość, np. id="...", class="..." albo title="...". Przeglądarka może próbować coś z tym zrobić, ale nie jest to poprawna i profesjonalna składnia. Atrybut title="stopka" również nie zadziała z selektorem #stopka, bo title służy głównie do podpowiedzi tekstowej, często widocznej po najechaniu kursorem. Nie jest identyfikatorem elementu i CSS nie łączy go automatycznie z kratką #. Dałoby się napisać selektor atrybutu, np. [title="stopka"], ale to zupełnie inny mechanizm i raczej nie o to chodzi przy typowym formatowaniu układu strony. Z kolei class="stopka" byłoby poprawne składniowo w HTML, ale wymagałoby selektora .stopka w CSS, czyli z kropką, a nie z kratką. Z mojego doświadczenia najłatwiej zapamiętać to tak: # pasuje do id, kropka pasuje do class. W projektach webowych ma to znaczenie nie tylko dla wyglądu, ale też dla czytelności kodu, walidacji HTML i późniejszej pracy z JavaScriptem czy narzędziami developerskimi.