Kurs języka HTML i CSS

Poradnik webmastera

  • Zwiększ rozmiar czcionki
  • Domyślny  rozmiar czcionki
  • Zmniejsz rozmiar czcionki
Wstawianie stylów

Zewnętrzny arkusz

Email Drukuj PDF

Tematy: metody wstawiania stylów | styl lokalny | rozciąganie stylu | wydzielone bloki | zagnieżdżanie arkusza | zewnętrzny arkusz | import arkusza

Każdą stronę można dołączyć do zewnętrznego arkusza stylów, w którym są zdefiniowane własności różnych elementów. Na przykład, strony są dołączane do zewnętrznego arkusza, pliku tekstowego o nazwie arkusz.css (rozszerzenie .css). Arkusz został zapisany następująco:

body {text-align: justify; margin-left: 1cm; margin-right: 1cm; margin-top: 1cm; }
p {font-family: Arial, Helvetica; font-size: 10pt; font-weight: normal; text-indent: 3 em; }
a, a:active, a:visited, a:hover {text-decoration: none; color: blue; }
h1 {font-size: 24pt; }
h2 {font-size: 20pt; }
h3 {font-size: 16pt; }
h1, h2, h3 {font-family: Arial, Helvetica; font-weight: bold; color: #808000; }
td {font-family: Arial, Helvetica; font-size: 10pt; font-weight: normal; }
li {font-family: Arial, Helvetica; font-size: 10pt; font-weight: normal; }

Uwaga: arkusz powinien zawierać wyłącznie same definicje stylów.


Aby dołączyć arkusz do strony, trzeba podać polecenie w ramach head:

<head>
<link rel="stylesheet" href="/sciezka/arkusz.css" type="text/css">
</head>

href wskazuje ścieżkę do katalogu, w którym jest umieszczony arkusz. Może on być, oczywiście, ulokowany w tym samym folderze, co strony zawierające odniesienie do niego. Wszystkie definicje zewnętrzego arkusza stylów są automatycznie przyjmowane przez elementy danej strony.

Stosowanie zewnętrznego arkusza ma tę zaletę, że nie jest konieczne wprowadzanie stylów na konkretnej stronie, zmniejszamy objętość plików, a także możemy za pomocą zmiany jednego parametru w arkuszu stylów zmienić wygląd wszystkich stron, które się odwołują do tego arkusza (np. kolor tytułu czy wielkość czcionki akapitów).

 

CSS. Tworzenie nowoczesnych stron WWW.

CSS3. Tworzenie nowoczesnych stron WWW
(czerwiec 2012)

HTML5 i CSS3. Standardy przyszłości

HTML5 i CSS3
Standardy przyszłości

CSS3. Szybki start. Wydanie V

CSS3. Szybki start.
Wydanie V