>Mulanya browser akan memuat file HTML dan CSS (jika kodenya di tulis sebagai external CSS).

>Kemudian,browser mengubah keduanya menjadi dockumen object model(DOM).ini adalah

Komponen yang mewakili file HTML dan CSS dalam memori perangkat pengunjung website.
> Setelah HTML dan CSS diubah menjadi DOM,browser akan melakukan rendering ,proses di
Mana browser menerapkan pengaturan di kode CSS pada elemen emen HTML
> Hasil nya adalah halaman website yang tampil di layar perangkat anda

Kemampuan CSS
>menentukan font selain default untuk browser
>menentukan warna dan ukuran teks dan tautan
>menerapkan warna ke latar belakang
>mengandung elemen halaman web dalam kotak dan megapung kan kotak kotak itu keposisi
Tertentu di halaman
> kemampuan dalam memasukan style ke dalam style sheet,yang membuat untuk pertamakalinya
,halaman web bisa dirancang

Contoh CSS
1. Menentukan font paragraf
Untuk mengatur font paragraf.Misalkan ingin semua paragraf dalam halaman
website berukuran 120% dan bewarna abu tua,kode di bawah ini:

P{font-size:120%;color:dimgray;}
2.Mengubah Warna Link
Warna link yang di tentukan dengan CSS ada empat,yaitu:
>Normal:warna link yang belum pernah di buka dan tidak di klik
>Visited:warna link yang sudah pernah di buka
>Hover:warna ketika anda meletakan kursor di atas link
>Active:warna link ketika ada klik
Untuk menentukan keempat warna itu,gunakan kode di bawah ini:
 a:link{color:gray;}a:visited{ color:green;}a:hover{color:purple;}a:active{color:teal;}
3.Menentukan Huruf Kapital /Kecil
Merubah paragraf berisi huruf kecil saja,kode;

<p class=”smallcaps”>paragraf anda.</p>

4.Membuat kotak teks

Kotak teks di gunakan untuk menonjolkan sebuah informasi penting.

Contoh CSS

p.important{border-style:solid;border width:5px;border-color:purple;}

5.Membuat Tombol Link

Link akan terlihat lebih mencolok jika di letakan dalam sebuah tombol.kodenya:

a:link,a:visited,a:hover,a:active{background-color:green;white;padding:10px25px;text-
align:center;text-decoration:none;display:inline-block;}

FUNGSI DARI BAGIAN BAGIAN KODE TERSEBUT

> a:link, a:visted, a:hover, a:active memastikan bahwa tombol anda akan selalu tampil meski sudah
diklik atau di tunjuk dengan krusor.

> background-color menentukan warna tombol.

> padding menentukan ukuran tombol.

>text-align menentukan letak teks dalam tombol ,misalnya di pinggir atau di tengah.

>text-decoration menentukan ada atau tidak nya garis bawah di text.

>display:inline-block memungkinkan anda untuk mengatur tinggi dan lebar tombol.