Jumat, Oktober 01, 2010
Administrator
Sebelumnya kita telah berbagai tutorial dasar. Ini adalah seri yang ke 5 dan kita akan mempelajari tentang CDD Id. Bagi yang belum membaca tutorial dasar CSS sebelumnya, silahkan ikuti:
Belajar CSS 1: Pengenalan CSS
Belajar CSS 2: Berbagai Metode Penggunaan CSS
Belajar CSS 3: Syntax CSS
Belajar CSS 4: CSS Class
Penulisannya...
Jika penulisan CSS Class dimulai dengan tanda titik (.) penulisan CSS Id dimulai dengan tanda pagar (#)
Formatnya: .namaid {property:value;}
Contohnya adalah sebagai berikut:
Artinya, bagian kolomatas akan diberi background hitam (#000) dan warna tulisannya adalah putih (#fff) juga ukuran tulisannya besar (large)
Penerapannya
Untuk menerapakan effect dari css di atas pada bagian HTML, maka penulisannya adalah:
<div id="kolomatas">
Tulisan atau bagian yang akan diberi style disini
</div>
Belajar CSS 1: Pengenalan CSSBelajar CSS 2: Berbagai Metode Penggunaan CSS
Belajar CSS 3: Syntax CSS
Belajar CSS 4: CSS Class
Ini sangat mirip dengan CSS Class, namun jika CSS Class digunakan beberapa kali, CSS Id hanya boleh unik atau setiap ID hanya boleh digunakan oleh satu bagian. CSS Class lebih digunakan untuk format style tulisan, sedangkan ID untuk melayout bagian-bagian utama template seperti header, sidebar atau kolom footer.
Penulisannya...
Jika penulisan CSS Class dimulai dengan tanda titik (.) penulisan CSS Id dimulai dengan tanda pagar (#)
Formatnya: .namaid {property:value;}
Contohnya adalah sebagai berikut:
#kolomatas{
color: #fff;
font-size: large;
background: #000;
background: #000;
}
Artinya, bagian kolomatas akan diberi background hitam (#000) dan warna tulisannya adalah putih (#fff) juga ukuran tulisannya besar (large)
Penerapannya
Untuk menerapakan effect dari css di atas pada bagian HTML, maka penulisannya adalah:
<div id="kolomatas">
Tulisan atau bagian yang akan diberi style disini
</div>
Pada bagian Tulisan atau bagian yang akan diberi style disini, Anda bisa memasukkan tulisan ataupun kode html yang nantinya gaya/style nya akan mengikuti sesuai dengan css kolom atas. Semoga bermanfaat dan saya akan memebrikan lebih di esok hari...
