LANDASAN TEOR
2.13 Cascading Style Sheet (CSS)
CSS atau yang memiliki kepanjangan Cascading Style Sheet, merupakan suatu bahasa pemrograman web yang digunakan untuk mengendalikan dan membangun berbagai komponen dalam web sehingga tampilan web akan lebih rapi, terstruktur, dan seragam.
CSS merupakan pemrograman wajib yang harus dikuasai oleh setiap pembuat program (Web Programmer), terlebih lagi itu adalah pendesain web (web designer). CSS saat ini dikembangkan oleh World Wide Web Consortinum (W3C) dan menjadi bahasa standar dalam pembuatan web. CSS difungsikan sebagai penopang atau pendukung, dan pelengkap dari file html yang berperan dalam penataan kerangka dan layout. CSS lintas
Universitas Sumatera Utara platform, maksudnya dapat dijalankan pada berbagai macam sistem operasi dan web browser. Secara umum, yang dilakukan oleh CSS adalah pengaturan layout, kerangka,
teks, gambar, warna tabel, spasi dan lain sebagainya.
Saat ini, CSS telah mencapai pada versi yang ketiga, di mana pada setiap versi selalu ada peningkatan. Perbedaan antara CSS-1, CSS-2, hingga CSS-3.
1. CSS-1, dikembangkan dan berpusat pada formatting dokumen HTML.
2. CSS-2, dikembangkan untuk bisa memenuhi kebutuhan tehadap format dokumen supaya bisa ditampilkan di printer. Pada CSS-2 ini mendukung juga dalam penentuan posisi konten, downloadable, font, table-layout, dan media type untuk printer.
3. CSS-3, merupakan versi pengembangan dari sebelumnya. Pada versi ini, terdapat beberapa tambahan dan mengarah pada efek animasi. Namun saat ini, belum semua didukung oleh web browser.
Ada dua jenis sifat CSS, yaitu internal dan eksternal. Internal, jika kode CSS yang akan dibuat tersebut kita masukkan atau sisipkan ke dalam file kode html. Namun, cara ini akan sungguh merepotkan jika kita membuat file lain dengan metode yang sama. Artinya, kita harus melakukan cara yang sama berulang-ulang (menyisipkan kode CSS ke dalam kode HTML). Eksternal, pembuatan kode CSS dan HTML terpisah. Artinya, kita membuat satu file CSS untuk kemudian file CSS tersebut dapat kita panggil berulang- ulang untuk dihubungkan dengan file HTML (melalui linked). Cara ini memang sangat disarankan untuk pembuatan desain web karena dapat menyingkat waktu pembuatan.
Universitas Sumatera Utara Cascading Style Sheet (CSS) adalah suatu cara untuk membuat format atau layout
halaman web menjadi lebih menarik dan mudah dikelola (Husni, 2007). CSS muncul karena sulitnya mengatur layout tampilan dokumen web yang dibuat dengan html murni meskipun telah menggunakan berbagai kombinasi format CSS dapat ditulis dengan pada bagian body, head suatu dokumen html atau diletakkan di sebuah file terpisah. Perintah- perintah CSS dibatasi oleh tag <style> dan </style>.
CSS mendefinisikan karakteristik tampilan (warna, style, dan posisi) suatu elemen pada dokumen html dalam bentuk properti elemen tersebut. Pemisahan isi dengan tampilan yang dilakukan dengan penerapan CSS ini, memberikan kemungkinan penyusunan struktur suatu halaman html dengan lebih fleksibel. CSS merupakan bagian/subset dari DOM yang sangat berperan dalam DHTML.
Perbedaan implementasi antara Netscape dan Microsoft sehingga akhirnya W3C melakukan suatu standardisasi CSS. Pada awalnya, upaya standardisasi CSS dibagi dua, yaitu CSS1 untuk pengaturan warna dan style, serta CSS-P untuk pengaturan posisi suatu elemen. CSS2 dari W3C selanjutnya menggabungkan kedua standar ini menjadi suatu standar yang meliputi semua setting tampilan suatu elemen halaman html.
Dalam spesifikasi CSS2, ada beberapa properti elemen dokumen yang berhubungan dengan posisi suatu elemen di halaman browser. Properti tersebut adalah:
1. Position, ada dua pilihan untuk nilai properti ini, yaitu absolute dan relative. Setting absolute mengatur posisi elemen berdasarkan jarak terhadap ujung kiri- atas elemen parent-nya. Sedangkan setting absolute bekerja sesuai layout html biasa dimana posisinya ditentukan berdasarkan akhir elemen sebelumnya.
Universitas Sumatera Utara 2. Left dan top, menentukan jarak ke arah kanan dan ke bawah dari posisi awal elemen. Unitnya bisa dinyatakan dalam point(pt), pixel(px) atau unit standar CSS lainnya.
3. Width dan height, menentukan lebar dan tinggi elemen. Unitnya bisa dinyatakan dalam point(pt), pixel(px) atau unit standar CSS lainnya.
4. Z-index, menentukan apakah suatu elemen ditampilkan di layar. Nilainya bisa visible (tampil) atau hidden (tersembunyi).
5. Overflow, menentukan perilaku ruang penampung jika isinya melebihi batasnya. Ada tiga pilihan untuk nilai properti ini, yaitu clip, scroll, dan none. Setting clip berarti isi akan dipotong jika melebihi batas. Scroll akan memunculkan scrollbar pada container. Sedangkan none tidak akan melakukan apapun terhadap isi sehingga isi tersebut akan keluar dari ruang batasnya.
6. Background-color atau layer-background-color, menentukan warna dasar dari suatu elemen. Yang pertama berlaku untuk IE, sedangkan yang kedua berlaku untuk NS.
7. Background-image atau layer-background-image, menentukan gambar latar belakang dari suatu elemen. Yang pertama berlaku untuk IE, sedangkan yang kedua berlaku untuk NS.
Beberapa hal yang dapat dilakukan oleh CSS (Husni, 2007), antara lain:
1. Mendefenisikan tampilan halaman web yang dibuat dalam satu tempat khusus, lebih baik daripada menulis berulang-ulang dalam satu atau beberapa halaman web.
Universitas Sumatera Utara 2. Kemudahan mengubah tampilan halaman web bahkan setelah halaman itu selesai dibuat. Karena style didefenisikan dalam satu tempat maka dapat mengubah tampilan sebuah situs dengan sekali kerja.
3. Mendefenisikan ukuran huruf dan atribut-atribut serupa yang memiliki akurasi atau setingkat word processor, menempatkan content halaman web dalam ketelitian pixel, mengulang pendefenisian tag-tag html secara keseluruhan.
4. Mendefinisikan style sesuai kebutuhan untuk link.
5. Mendefenisikan layer yang dapat diletakkan di atas elemen lain.