Które polecenie w CSS służy do załączenia zewnętrznego arkusza stylów?
A. open
B. import
C. require
D. include
Pytanie z egzaminu CKE, styczeń 2015 (arkusz E.14-X-15.01).
W CSS do dołączania zewnętrznego arkusza stylów służy reguła @import, więc odpowiedź import jest właściwa. W praktyce zapisuje się ją najczęściej na początku pliku CSS, np. @import url('layout.css'); albo @import 'colors.css';. Dzięki temu jeden arkusz stylów może pobrać inny arkusz, co bywa przydatne przy dzieleniu kodu na mniejsze pliki, np. osobno typografia, osobno układ strony, osobno kolory. Moim zdaniem to jest całkiem czytelne przy małych projektach albo przy nauce CSS, bo łatwo zobaczyć zależności między plikami. Warto jednak pamiętać o dobrej praktyce branżowej: w normalnych stronach często lepiej podłączać główny plik CSS w HTML przez element link, np. rel='stylesheet', ponieważ przeglądarka może sprawniej pobierać zasoby. @import jest częścią składni CSS jako tzw. at-rule, czyli reguła zaczynająca się od znaku @. Ważne jest też, że @import powinno znajdować się przed zwykłymi selektorami CSS, bo standard CSS wymaga, aby importy były umieszczane na początku arkusza, ewentualnie po @charset. Jeśli wpiszesz je w środku pliku po normalnych regułach, może nie zadziałać tak, jak oczekujesz.
W tym pytaniu łatwo pomylić CSS z językami programowania albo mechanizmami znanymi z innych technologii webowych. W CSS właściwą konstrukcją jest @import, czyli reguła arkusza stylów używana do pobrania innego pliku CSS. Same słowa require, include i open mogą brzmieć technicznie, ale nie należą do składni CSS odpowiedzialnej za załączanie arkuszy stylów. require kojarzy się raczej z JavaScriptem, Node.js albo z PHP, gdzie może służyć do dołączania modułów lub plików. To zupełnie inny kontekst: tam mówimy o wykonywaniu kodu programu, a nie o kaskadowych stylach opisujących wygląd elementów HTML. include również jest popularne w PHP i w różnych systemach szablonów, ale CSS nie posiada takiego polecenia do importowania plików. open może sugerować otwieranie pliku, okna albo zasobu, lecz w arkuszach stylów nie używa się takiego słowa kluczowego do ładowania zewnętrznego CSS. Typowy błąd myślowy polega na tym, że uczniowie przenoszą nazwy instrukcji z jednego języka do drugiego, bo wszystkie dotyczą jakoś pracy z plikami. W technologiach webowych trzeba jednak mocno pilnować warstwy, w której pracujemy: HTML odpowiada za strukturę, CSS za wygląd, JavaScript za zachowanie, a PHP działa po stronie serwera. Z mojego doświadczenia najlepiej zapamiętać to tak: w HTML podpinamy style przez link, a wewnątrz CSS do pobrania innego arkusza używamy @import.