CSS - wstawianie stylów

Kaskadowe arkusze stylu - wstawianie stylów

Kaskadowe arkusze stylu można wstawiać na stronie na kilka sposobów, stosując:

1. styl wpisany
wprowadzone zmiany odnoszą się do pojedynczego znacznika

<znacznik style="włąściwość: wartość"></znacznik>
<znacznik style="włąściwość: wartość" />
<span style="color: red; background-color: yellow;">czerwony tekst na żółtym tle</span>
wynik kodu:
czerwony tekst na żółtym tle


2. wewnętrzny arkusz stylów (styl osadzony)
umieszcza się go wewnątrz elementu <head></head> wprowadzone zmiany odnoszą się do pojedynczej strony

<style type="text/css">
<!--
p {
color: yellow;
font-size: 11pt;
}
-->
</style>

<p>czerwony tekst o rozmiarze czcionki 16px</p>
wynik kodu:

czerwony tekst o rozmiarze czcionki 16px



3. zewnętrzny arkusz stylów

umieszcza się go w elemencie: <head></head>

<link type="text/css" href="nazwa-pliku-arkusza.css" rel="stylesheet" />
<link type="text/css" href="style.css" rel="stylesheet" />
z kolei zewnętrzny akrusz stylu ma rozszerzenie css
przykładowy kod w zewnętrznym arkuszu stylów style.css:

p {
color: yellow;
font-size: 11pt;
}

Kolejność używania stylów przez przeglądarkę internetową:
  1. styl wpisany
  2. wewnętrzny arkusz stylów
  3. zewnętrzne arkusze stylu