Pages

Monday 25 April 2011

Cascading Style Sheet (CSS)

Cascading Style Sheet merupakan sebuah bahasa script yang kegunaannya adalah untuk mengatur tampilan dokumen html, contohnya seperti pengaturan jarak antara baris, teks, warna, dan format border bahkan penampilan file gambar.

CSS dikembangkan oleh W3C, organisasi yang mengembangkan teknologi internet. Tujuannya tak lain untuk mempermudah proses penataan halaman web. Perlu diingat CSS hanyalah berupa kumpulan script yang tujuannya bukan untuk menggantikan HTML, melainkan pelengkap agar dokumen HTML bisa tampil lebih cantik dan dinamis.

Sejak awal ditemukannya CSS pada awal decade 90an, CSS terus dikembangkan dan diserap oleh web developer. Merupakan features baru dari HTML 4.0. Hal ini diperlukan setelah melihat perkembangan HTML menjadi kurang praktis karena web pages terlali banyak dibebani hal-hal ang berkaitan dengan faktor tampilan seperti font dll..

Untuk itu jika kumpulan style dikelola secara terpisah maka manajemen pages menjasi lebih mudah dan efisien. Pada prakteknya penggunaan CS ini didukung oleh hampir semua browser yang terpopuler saat ini seperti Mozila, Safari, Chrome, IE, dll.

Aturan Penggunaan CSS
Secara umum disusun oleh tiga bagian yaitu selector (elemen yang akan di definisikan), property(atribut yang akan dirubah), dan nilai perubahannya sebagaimana berikut:
Selector{property:value}
Antara property dan nilai disahkan dengan titik dua (colon) seperti contoh di bawah ini
body{color:black}
Ada beberapa cara penulisan kode CSS, cara tersebut a.l:

Style Sheet Eksternal
Dalam beberapa tutorial sering pula disebut dengan Linked CSS. Ini adalah salah satu teknik menggunakan CSS, yaitu dengan memisahkan script CSS dari dokumen HTML. Ada beberapa keuntungan yang bisa kita dapat dari teknik ini:
• Kita tidak perlu membuka dokumen HTML untuk mengedit CSS (karena telah berupa file yang terpisah)
• File CSS yang sama dapat kita gunakan untuk beberapa dokumen yang berbeda, menghemat waktu dalam proses desain web.
Sintaks kode yang digunakan tetap sama, akan tetapi dibuat pada file yang berbeda dengan HTML. Ekstensi yang digunakan harus disimpan dalam format “.css”

Style Sheet Internal
Dalam beberapa buku dan tutorial ada pula yang menyebutnya Header Style. Maksudnya berarti menuliskan script CSS pada header dokumen HTML, didalama bagian head. Definisi style dengan cara ini lebih dianjurkan karena selain lebih rapi, pendefinisian tag cukup dilakukan sekali.
Selain itu teknik ini juga digunakan bila suatu web page tertentu bersifat sangat unikm sehingga membutuhkan definisi terpisah dibandingkan dengan web page lainnya.

Style Sheet Inline
Cara penulisan CSS yang satu ini bisa digunakan pada lokasi yang sangat spesifik. Sebenarnya penggunaan CSS dengan cara ini walaupun bisa dilakukan tetaoi tidak dianjurkan. Namun bilapun perlu, anda tetap bisa menggunakan cara ini bila dokumen web page yang ingin ditampilkan unik dan berbeda dari defaultnya. Mengapa cara ini tidak dianjurkan? Karena menyebabkan file dokumen menjadi lebih besar ukurannya. Ini disebabkan karena style didefinisikan satu persatu.

No comments:

Post a Comment