External Style Sheet Internal Style Sheet Inline Styles

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