Wstawienie arkusza stylów CSS <link "stylesheet">
Jak wygląda typowy sposób dołączania arkusza CSS?
W zasadzie aby rozpocząć przygodę z językiem CSS, wystarczy wstawić w nagłówku strony - tzn. w dowolnym miejscu pomiędzy znacznikami <head> oraz </head> - jedną dodatkową linijkę:
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="description" content="Tu wpisz opis zawartości strony"> <title>Tu wpisz tytuł strony</title> <link rel="stylesheet" href="style.css"> </head> <body> Tu wpisuje się treść strony </body> </html>
Dzięki znacznikowi <link> do dokumentu zostanie automatycznie dołączony arkusz stylów. W nim właśnie wpisuje się wszystkie polecenia zmieniające wygląd strony. Ważne jest tylko, aby ten plik posiadał rozszerzenie *.css. W powyższym przykładzie jest to plik pod nazwą "style.css", który znajduje się w tym samym katalogu co dokument *.html. Można go oczywiście zapisać w innej lokalizacji - wtedy zamiast "style.css" trzeba podać pełną ścieżkę dostępu (tworzy się ją w analogiczny sposób, jak przy wstawianiu obrazka).
Warto podkreślić, że jeśli Twoja strona WWW składa się z wielu podstron, na każdej z nich możesz dołączyć ten sam plik arkusza stylów. Dzięki temu zmiany wykonane tylko w jednym miejscu - czyli w pliku arkusza stylów - wpłyną na wygląd od razu wszystkich podstron Twojego serwisu. Czyż to nie jest piękne? Już nigdy więcej nie będzie Cię czekać żmudne przerabianie każdej podstrony tylko po to, aby zmienić na niej np. kolor albo rozmiar tekstu 🙂
Dla zainteresowanych
Jeśli chcesz dowiedzieć się więcej na temat dodatkowych możliwości wstawiania stylów CSS na stronach internetowych, zobacz rozdział: Wstawianie stylów.
Pytania i odpowiedzi <link "stylesheet">
Jak dodać styl CSS?
Najbardziej zalecanym sposobem wstawienia stylów CSS jest dodanie arkusza stylów do dokumentu HTML.
Jak dodać arkusz stylów do HTML?
Najczęściej spotykanym sposobem jest zapisanie arkusza stylów CSS w osobnym pliku, a następnie wstawienie odniesienia do niego w nagłówku dokumentu HTML. Na przykład jeśli plik arkusza stylów nazywa się "style.css" i znajduje się w tym samym katalogu na dysku komputera co dokument *.html, można się posłużyć następującym znacznikiem: <link rel="stylesheet" href="style.css">. Polecenie to należy wstawić w dowolnym miejscu sekcji <head>...</head> dokumentu HTML. Trzeba jednak przy tym pamiętać, że w pliku *.html może się znajdować tylko jeden znacznik nagłówka dokumentu. Zatem nie tworzymy nowego, tylko używamy już istniejącego!
Jak zrobić zewnętrzny CSS?
Zewnętrzny arkusz stylów można utworzyć przy pomocy dowolnego edytora CSS albo jeszcze lepiej przy pomocy edytora HTML z wbudowaną obsługą również języka CSS. Arkusz stylów zapisujemy na dysku w pliku z rozszerzeniem *.css, a następnie możemy go dołączyć do dokumentu HTML za pomocą odpowiedniego znacznika w sekcji nagłówkowej strony - np.: <link rel="stylesheet" href="style.css">.