Anda di halaman 1dari 32

Pemrograman Web 1

Oleh : Yati Nurhayati


 Jika anda memiliki sekian halaman yang
memiliki format yang seragam, dan kemudian
ingin merubah format dasarnya, tentu yang
anda lakukan adalah mengubah tiap halaman
tersebut.
 Feature untuk membuat dynamic HTML.
 Style sheet mendeskripsikan bagaimana
tampilan document HTML di layar (template)
 Support ke semua browser (example :
mozzila, ie, opera, netscape, dll).
 Bentuk umum :

 Contoh :
 Bentuk umum internal css :
<style type=“text/css”>
…definisi style…
</style>
 Contoh :
 Bentuk umum sama seperti pada internal css,
hanya saja diletakan didalam<BODY>
Contoh :
 Sintaxiss CSS terbagi menjadi 3 bagian :
selector {property : value}
tag HTML yang akan
◦ Selector disimpan didalam
didefinisikan (body, H1, Link , dll).
◦ property berisi atribut yang akan diubah
◦ Value : nilai untuk property
contoh : color : green;
/* property : color, value : green */
 Nilai untuk property tidak boleh dalam tanda
petik.
 Nama property bersifat case sensitive.
 Untuk membuat komentar : /* isi komentar */
atau : <!– isi komentar - - >
 Cara mendeklarasikan kelompok : (tanda
koma serta &) contoh :
H1, H2 {color : green};
H3, H4 & H5 {color : red};
 Bentuk umum :
◦ Pendeklarasian selector :
selector { property : value; }
◦ Pengaksesan/Pemanggilan selector :
<selector>text yang akan dimodifikasi
</selector>
 Bentuk umum :
◦ Pendeklarasian selector :
selector { property : value }
◦ Pengaksesan/Pemanggilan selector :
<tag_html class=“selector”> text yang
akan dimodifikasi </tag_html>
 Bentuk umum :
◦ Pendeklarasian selector :
#selector { property : value }
◦ Pengaksesan/Pemanggilan selector :
<tag_html id=“selector”>text yang akan
dimodifikasi </tag_html>
 background-color : hexadesimal.
ex/ background-color : #99CCFF
 background : warna.
ex/ background : green
ex/ background-color : transparent
 background : rgb
ex/ background : rgb(240,248,255)
 Margin  hanya pengaturan sisi halaman,
padding  pengaturan sisi halaman dan
tabel.
 padding-top : 10%;
 padding-right : 20%;
 padding-bottom : 40%;
 padding-left: 20%;

Anda mungkin juga menyukai