Istnieją dwa rodzaje osadzania stylów CSS w dokumencie internetowym czyli na stronie WWW. Kaskadowy arkusz stylów można umieścić albo wewnątrz konkretnego dokumentu, albo też dołączyć go do strony z osobnego pliku. Pierwsze rozwiązanie to tzw. style wewnętrzne – stosowane jest do prostych stron internetowych, z małą liczbą elementów których wygląd chcemy kształtować za pomocą CSSa. Natomiast drugie rozwiązanie – style zewnętrzne – jest rozwiązaniem dedykowanym do większych projektów.
Style wewnętrzne:
• Styl lokalny – umieszcza się go wewnątrz konkretnego znacznika formatowanego
elementu. Działanie stylu obejmuje tylko ten jeden, konkretny element.
<p style=”color:green; font-size:14px; font-variant: small-caps;”> Treść akapitu </p>
• Styl zagnieżdzony – umieszcza się go w nagłówku strony WWW. Swoim
działaniem obejmuje cały dokument, a nie tylko pojedyncze elementy.
<html> <head>

<style type=”text/css”> P
{
color:green; font-size:14px; font-variant: small-caps;
} </style>
</head>
<body> Treść strony
<p> Treść akapitu do którego odnosi się styl CSS </p> </body> </html>
• Styl zewnętrzny – umieszczany jest w zewnętrznym pliku o rozszerzeniu .css. Oczywiście plik ten powinien być  umieszczony w tym samym katalogu co projektowany dokument internetowy. W nagłówku strony WWW umieszczany jest odnośnik do arkusza CSS.
<html>
<head>
<link href=”arkusz.css” rel=”stylesheet” type=”text/css” >
</head>
<body> Treść strony
<p> Treść akapitu do którego odnosi się styl CSS </p> </body> </html>
Natomiast sam dokument .css jest zwykłym plikiem tekstowym, w którym zapisano reguły wyglądu (prezentacji) strony WWW. Ważne jest jednak aby miał on odpowiednie rozszerzenie, np. możemy nazywać go arkusz.css bądź style.css!

 

Ustawianie koloru tła

Kolor tła (po angielsku background color) ustawniane są w arkuszach CSS dla wszsytkich elementów. W poniższym przykładzie ustawmy kolor tła dla całego elementu <body>:

BODY {background-color:#FF6666;}