CSS atau "Cascading Style Sheets" yaitu cara untuk memisahkan
isi dengan layout dala halaman-halaman web yang dibuat.CSS memperkenalkan
template yang berupa style untuk membuat dan mempermudah penulisan dari
halaman-halaman yang dirancang.Hal ini sangat penting karena halaman yang
menggunakan CSS dapat dibaca secara bolak balik dan isinya dapat dilihat oleh
pengunjung manapun. CSS mampu menciptakan halaman yang tampak sama pada
resolusi layar dari pengunjung yang berbeda tanpa memerlukan suatu tabel.
Dengan CSS, Anda akan lebih mudah melakukan setting tampilan keseluruhan web
hanya dengan menggantikan atribut-atribut atau perintah dalam style CSS dengan
atribut yang diinginkan tanpa harus mengubah satu per satu atribut tiap elemen
yang ada dalam situs yang dibuat. Saat ini CSS merupakan style yang banyak
digunakan karena berbagai kemudahan dan kelengkapan atribut yang dimilikinya. Penggunaan
CSS dalam web akan lebih efisien karena CSS dapat digunakan untuk penggunaan
secara berulang pada tag-tag tertentu sehingga tidak usah mengetikkan ulang
seluruh perintah pemformatan seperti halnya HTML klasik. CSS akan lebih mudah
dipelajari jika telah mengetahui struktur pembuatan dokumen web dengan bahasa
HTML.
CARA KERJA CSS
Cara kerja CSS sangatlah mudah, karena CSS hanya membutuhkan
style sebagai penentu dari font, warna, dan formatan-formatan lain untuk
memformat atribut sebuah halaman web yang kita buat. Tiap style memiliki dua
buah elemen dasar, yaitu “selector” dan ”declaration”. Sebuah “selector”
biasanya adalah tag HTML, sementara “declaration” adalah satu atau beberapa
perintah atau nilai dari CSS yagn menunjukan tipe bentuk yang diaplikasikan
pada selector. Declaration ini biasanya ditandai dengan kurung kurawal {}. Perintah
atau nilai CSS yang berbeda dipisahkan satu dengan yang lain dengan menggunakan
titik-koma (;).
Di sini terlihat bahwa :
Selector-selector dan style dalam
CSS akan dimasukkan dalam sebuah tempat yang sama dalam isi dokumen HTML atau dibuat
di luardokumen HTML yang nantinya akan dipanggil untuk menentukan isi tampilan
dokumen HTML. Anda hanya menunjuk pada selector-selector dimana akan
mengaktifkan sebuah style yang anda inginkan.
Hal paling umum dalam memasukkan
kode style sheet dengan menggunakan tag <style>, tag <style> ini
selalu tampil dalam bagian <head> dan sebelum </head> dari dokumen
anda. Perhatikan garis besarnya seperti berikut:
Tampilan dalam browser akan terlihat seperti gambar di bawah
ini :
Bandingkan jika dokumen tersebut dibuat dengan menggunakan
CSS.
Dengan menggunakan CSS, dokumen yang dibuat menggunakan HTML
murni akan dapat lebih mengefisiensikan waktu yang dibutuhkan. Bayangkan jika
anda membuat sebuah situs yang kompleks dengan banyak atribut untuk tiap halaman
dalam situs anda. Tentunya anda harus menentukan tiap atribut untuk tiap
halaman tersebut satu per satu. Bagaimana jika terdapat seratus halaman dalam
situs tersebut? Bayangkan berapa banyak awktu anda habiskan hanya untuk
memformat tiap halaman jika terdapat kesalahan dalam halaman-halaman tersebut? Namun
masalah tersebut dapat lebih diminimalisasi menggunakan CSS karena anda hanya
akan membuat sebuah style yang akan memformat keseluruhan halaman dalam situs
yang dibuat dan kita cukup menentukan selector dalam style yang akan digunakan
dalam halaman tersebut.
KEUNTUNGAN CSS
Sementara CSS memungkinkan anda untuk memisahkan layout dari
isi dokumen, CSS memungkinkan anda untuk menentukan layout yang lebih ampuh
dibandingkan dengan HTML.
Dengan CSS, anda dapat:
1. Menentukan tampilan dari halaman-halaman web sebuah
tempat tanpa mengulangnya kembali melalui script HTML anda. Ini akan lebih
efisien dibandingkan menentukan warna dan font tiap kali anda memulai sebuah
cell baru dalam sebuah tabel.
2. Dengan mudah mengubah tampilan dari
halaman-halaman web walaupun setelah halaman tersebut dibuat. Setelah style
ditentukan dalam sebuah tempat, anda dapat mengubah tampilan keseluruhan situs
sekaligus tanpa harus mengganti tag-tag tertentu ketika mengubah salah satu
tampilan dari elemen dalam halaman anda.
3. Menentukan ukuran font dan atribut yang
sejenis dengan keakuratan yang sama dengan sebuah “word processor” dan tidak
dibatasi hanya untuk tujuh ukuran font berbeda yang telah ditetapkan dalam HTML
4. Menentukan isi hingga ukuran piksel dari tiap
halaman web dengan akurat.
5. Menentukan kembali keseluruhan tag-tag HTML. Sebagai
contoh, anda dapat dengan mudah membuiat tebal tag menjadi berwarna merah
menggunakan font yang spesial.
6. Menentukan style yang kita inginkan untuk sebuah
link,seperti menyingkirkan garis bawah yang biasa terlihat dibawah link.
7. Menentukan layer-layer yang dapat diposisikan di
atas layer-layer lainnya (kadang digunakan untuk menu-menu mejadi terlihat
lebih menarik).
8. Halaman web anda akan di-load lebih cepat,
karena tidak diisi dengan tag-tag yang mengatur tiap halaman akan disimpan
dalam sebuah dokumen CSS yang hanya di-load sekali ketika pengunjung memasuki
situs anda.
Namun CSS memiliki satu kekurangan, yaitu :
CSS hanya dapat ekerja dalam browser versi 4 atau lebih. Namun
dewasa ini lebih dari 95% dari keseluruhan browser telah banyak yang
mendukungnya. Jadi kekhawatiran tentang tidak dapat ditampilkannya situs yang
kita buat dengan menggunakan CSS akan makin terkikis.
Sumber : Buku "Desain web menggunakan HTML + CSS" , Penulis : SUGIRI, Amd.,S.Pd. , Penerbit ANDI Yogyakarta.
Tidak ada komentar:
Posting Komentar