Bagi pengguna internet terutama web design istilah CSS (Cascading Style Sheet) sudah tidak asing lagi. Atribut yang satu ini merupakan salah satu fasilitas yang diberikan untuk pemrograman HTML dengan demikian pengaturan tampilan menjadi lebih fleksibel. Dengan atribut CSS user diberikan kebebasan untuk mengatur posisi secara absolut, mengubah warna, besar font, margin dan sebagainya.
Penulisan Atribut CSS ada 3 metode antara lain :
1. Inline Style Sheet
2. Embedded Style Sheet
3. Linked Style Sheet
Untuk jelasnya lihat keterangan berikut ini
1. Inline Style Sheet
Bentuk ini dengan cara mendefinisikan langsung menjadi satu dalam halaman HTML. Cara penulisannya cukup dengan menambahkan atribut STYLE =” … ” sehingga hanya berlaku untuk pada halaman tersebut tidak mempengaruhi HTML yang lain.
< HTML >
< Head >
< Title > Contoh Bentuk Inline < /Title >
</ Head >
< Body bgcolor=”#FFFFFF”>
< P id=”contoh 1” > contoh tanpa format < P >
< P id=”contoh 2” style=”font-size:20pt” > contoh dengan font 20 < P >
< P id=”contoh 3” style=”font-size:14pt ; color:red” > contoh dengan font 14 dan warna merah < P >
< /Body >
< /HTML >
2. Embedded Style Sheet
Bentuk ini untuk memudahkan dalam penggolongan HTML. Metode ini dilakukan dengan mendefinisikan CSS terlebih dahulu dalam tag <Style >…..</Style> atau di atas tag <Body>. Pendefinisian atribut CSS ini disesuaikan dengan penggunaan tag – tag HTML seperti <p>, <div > yang selanjutnya tinggal menggunakan sesuai dengan definisi kode HTML yang ada
< HTML >
< Head >
< Title > Contoh Bentuk Inline < /Title >
</ Head >
< Body >
< H1 id="contoh 1" > Judul ini berukuran 18 merah < /H >
< P id="contoh 2" > contoh font 12 identitas 0.5 inchi < P >
< P id="contoh 3" style="font-size:14pt ; color:red" > contoh dengan font 14 dan warna biru < P >
< /Body >
< /HTML >
Contoh yang lain
<Style >
p.biru {font-size:12pt; color:blue}
p.merah {font-size:12pt; color:red}
<Style >
3. Linked Style Sheet
Bentuk ini hamper mirip dengan tipe nomor dua (embeded), bedanya hanya pada pendefisian tag < Style > dalam file terpisah, sehingga CSS ini memiliki keuntungan dapat digunakan untuk beberapa file HTML.
Kode dibawah ini diletakan dalam file dengan extension CSS
Kemudian dari file html panggil dengan perintah <Link> yang diletakan dalam tag < head >, seperti pada contoh berikut
< HTML >
< Head >
< Title > Contoh Bentuk Linked < /Title >
< Link rel =stylesheet href=”link.css” type=”text/css” >
</ Head >
< Body >
< H1 id="contoh 1" > Judul ini berukuran 18 merah < /H >
< P id="contoh 2" > contoh font 12 identitas 0.5 inchi < P >
< P id="contoh 3" style="font-size:14pt ; color:red" > contoh dengan font 14 dan warna biru < P >
< /Body >
< /HTML >
skyt0102@gmail.com
MasPaulus
matur nuwun untuk pengajarannya yang nantinya akan saya terima...