Ada tiga jenis penulisan CSS, yaitu:
1. External Style Sheet
CSS ditulis diluar file HTML. File yang terbuat disimpan dalam format .css
contoh:
head link rel
= stylesheet t pe= te tcss href= desai . ss head
2. Internal Style Sheet
Ditulis didalam file HTML. Internal style sheet seharusnya digunakan dalam dokumen tunggal yang mempunyai style
yang unik. Didefinisikan diantara tag headhead
3. Inline Styles
Kode CSS ditulis langsung dalam tag HTML. Contoh:
p st le= olor: red; argi -left : 20p teks HTML yang akan ditampilkan
p Contoh:
head st le t pe= te tcss
hr {color: red} p {margin-left: 20px}
body {background-image: url
i agesga ar.gif }
style head
head
Body {
background: 125084; color: white;
} H1
{ color: 00ff00;
} p.versi2
{ color: e2ff5a;
font-family: calibri; font-size: 24px;
}
HTML HEAD
TITLEDesain Web Dengan CSSTITLE LINK REL=STYLESHEET TYPE=textcss
HREF=efek.css HEAD
BODY H1MEMPERINDAH TAMPILAN DENGAN CSSH1
PLatihan Desain Web Dengan CSS. br Paragraf ini merupakan paragraf biasa. Perhatikan
bahwa warna tulisan adalah putih. br Secara default untuk halaman web ini warnanya
diatur sesuai dengan selector body pada file efek.cssp
p class=versi2Paragraf ini adalah paragraf dengan class versi2 yang diatur
oleh file efek.css.p BODY
HTML
EKSTERNAL STYLE SHEET
HTML HEAD
TITLEMendesain Web dengan CSSTITLE STYLE type=textcss
body { color: white;
background: green; font-family : arial;
} STYLE
HEAD BODY
H1BROWSERH1 PBrowser adalah aplikasi untuk mengakses halaman web.p
Halaman ini didesain dengan menggunakan CSS. BODY
HTML
HTML HEAD
TITLEDesain WebTITLE HEAD
BODY style=color: white; background: green;
font-family : arial; H1 style=color: yellow;BROWSERH1
P style=color: red; font-family: calibri; font-size: 24px;Tulisan ini menggunakan CSS dengan gaya penulisan inline style sheetp
paragraf ini menggunakan property yang didefinisikan di dalam tag body. BODY
HTML
HTML HEAD
TITLEMenggunakan Background WarnaTITLE
STYLE type=textcss body {background-color : 99CCFF}
h2 {background : green} h3 {background-color : transparent}
p {background : rgb240,248,255} STYLE
HEAD
BODY h2Header 2, Background Hijauh2
h3Header 3, Bakground Transparanh3 pBackground pada paragraphp
BODY HTML
1. BACKGROUND WARNA LATIHAN4.HTML