Pytanie 1
W CSS określono styl dla stopki. Jak można zastosować to formatowanie do bloku oznaczonego znacznikiem div?
#stopka { ... }W praktyce wygląda to tak:
CSS:
#stopka {
background-color: #333;
color: white;
padding: 20px;
}
HTML:
<div id="stopka">To jest stopka strony</div>
Przeglądarka łączy selektor #stopka z elementem, który ma id="stopka" i nakłada na niego zdefiniowane właściwości. Identyfikator powinien być unikalny w obrębie całego dokumentu HTML, co jest zgodne z zaleceniami W3C i ogólnie przyjętą dobrą praktyką. Do jednego ID odwołujemy się w CSS przez #, a w JavaScript przez document.getElementById("stopka").
Moim zdaniem warto zapamiętać prostą zasadę: # w CSS = id w HTML, kropka (.) w CSS = class w HTML. Gdy projektujesz layout strony, zwykle elementy typu nagłówek, stopka, główna nawigacja mają unikalne ID, bo występują raz na stronie. Natomiast powtarzalne elementy (np. kafelki z produktami) dostają klasy. Dzięki temu kod jest czytelniejszy, łatwiej się go utrzymuje i unikamy dziwnych konfliktów stylów. Dobrą praktyką jest też używanie opisowych nazw, np. id="stopka" zamiast skrótów typu id="s1", bo po miesiącu nikt nie pamięta, co to znaczyło.



