Wstawianie stylów
Arkusze CSS można wstawić do dokumentu na trzy sposoby
Jako zewnętrzny plik
Służy do tego tag <link> - odnośnik:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" title="styl css" href="http://example.com/style.css" />
</head>
```
Dozwolone jest też deklarowanie wielu zewnętrznych arkuszy stylów w jednym dokumencie. Między takimi stylami użytkownik będzie mógł się przełączać z poziomu przeglądarki.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" title="domyslny" href="http://example.com/style_01.css" />
<link rel="alternate stylesheet" title="drugi" type="text/css" href="http://example.com/style_02.css" />
<link rel="alternate stylesheet" title="trzeci" type="text/css" href="http://example.com/style_03.css" />
<link rel="alternate stylesheet" title="czwarty" type="text/css" href="http://example.com/style_04.css" />
</head>
```
W nagłówku dokumentu html (arkusz osadzony)
W nagłówku dokumentu html (arkusz osadzony)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
div { color: red }
</style>
</head>
```
Przy tagu, którego styl dotyczy (styl wpisany)
Przy tagu, którego styl dotyczy (styl wpisany)
<body>
Lorem ipsum
</body>
```
W jednym dokumencie mogą zostać użyte wszystkie sposoby jednocześnie, ale należy pamiętać ze stanowią one kaskadę i będą się nawzajem zasłaniać. Styl wpisany jest dla przeglądarki najważniejszy, potem jest arkusz osadzony, a zewnętrzny arkusz stylów jest najmniej istotny.
W powyższym przykładzie mamy definicje koloru czcionki (Color) dla tagu Div w nagłówku strony i przy tagu. W uproszczeniu można powiedzieć ze przeglądarka zastosuje kolor czerwony z definicji z nagłówka strony, a później natrafi na definicje koloru znajdującą się przy tagu div i "pokoloruje" go na zielono.
Gdyby tagów div było więcej, to te bez deklaracji "color" były by czerwone gdyż dotyczyłaby ich deklaracja z nagłówka dokumentu.
Super porada :)
"arkusz styli", "Wstawianie styli" - NIE NIE "styli"! Jeśli już to stylów.
Akusz stylów, arkusza stylów, arkuszy stylów, no i tytuł też boski, przenieście z odpowiednio odmieniona forma :|