Pengertian, Sejarah, Fungsi, Kelebihan, Kekurangan, dan Struktur Dasar CSS

Pada artikel kali ini saya akan membahas tentang Pengertian CSS, Sejarah CSS, Fungsi CSS, Kelebihan CSS, Kekurangan CSS, dan Struktur Dasar CSS.

CSS adalah bahasa pemrograman kedua setelah  HTML yang harus dipelajari oleh seorang yang ingin menjadi seorang developer.

 

 

PENGERTIAN CSS

Cascanding  Style Sheets (CSS) adalah bahasa desain web (style sheet language) yang mengontrol format tampilan dari sebuah halaman website yang ditulis menggunakan penanda markup language.  CSS biasanya digunakan untuk mendesain sebuah halaman HTML dan XHTML, tetapi sekarang CSS bisa diaplikasikan untuk segala dokumen xml, termasuk SVG dan XUL bahkan android.

 

 

SEJARAH CSS

CSS pertama bermula sejak munculnya SGML pada tahun 1970an. Sejak kemunculannya tersebut, CSS mengalami  perkembangan yang sangat pesat. Format dasar dari CSS yang yang banyak digunakan sekarang ini merupakan ide dari seorang programer yang bernama Hakon Wium Lie yang tertuang dalam proposalnya mengenai Cascanding HTML Style Sheet (CHSS) pada bulan oktober 1994 (dalam konferensi W3C di Chicago, Illinois). Kemudian, beliau bersama dengan seorang temannya yang bernama Bet Bos mengembangkan suatu standar CSS.

Pada akhir tahun 1996, CSS resmi dipublikasikan (dan menyusul kemudian CSS level 1 pada bulan Desember). Pengerjaan proyek ini dibantu oleh seorang programer bernama Thomas Reardon dari perusahaan software ternama yaitu microsoft.

 

VERSI CSS

a. CSS Level 1

Pada tanggal 17 agustus 1996 World Wide Web Consortium (w3C) menetapkan CSS sebagai bahasa pemrograman standar dalam pembuatan halaman web. Tujuan utamanya untuk menggurangi pembuatan tag-tag baru oleh Netscape dan Internet Explorer, karena kedua browser tersebut sedang bersaing mengembangkan tag sendiri untuk mengatur tampilan halaman website.

CSS1 mendukung pengaturan tampilan dalam hal:

1. Font (jenis ketebalan).

2. Warna, teks, background, dan elemen yang lainnya.

3. Text atribut, misalnya spasi antar kata.

4. Posisi teks, gambar, table dan elemen lainnya.

5. Margin, border dan padding

 

b. CSS Level 2

CSS2 ini dibuat untuk menyempurnakan CSS tahap awal dengan menciptakan standard CSS 2 yang menjadi standard dari tahun 1998 hingga saat ini. CSS2 dikembangkan untuk memenuhi kebutuhan terhadap format dokumen agar bisa ditampilkan di printer.

 

c. CSS Level 3

CSS3 merupakan versi terbaru dari CSS yang mampu melakukan banyak hal dalam desain website. CSS3 dapat melakukan animasi halaman website, seperti animasi warna dan 3D. Selain itu, banyak fitur baru, yaitu:

1. Animasi

2. Beberapa efek teks, seperti teks bayangan, kolom koran, dan word wrap.

3. Beberapa efek pada kotak, seperti transformasi 2 dimensi, sudut-sudut yang tumpul dan bayangan.

 

 

KELEBIHAN CSS

1. CSS sangat mudah untuk digunakan dan dipelajari.

2. CSS memisahkan antara desain dan konten web.

3. Pengaturan desain dapat dilakukan seefesien mungkin.

4. Mempersingkat waktu kerja, baik saat membuat ataupun saat memodifikasi halaman web.

 

 

KEKURANGAN CSS

1. Menyita waktu karena tidak semua browser dapat mengartikan sintaks CSS yang sama

2. Kadang desain sudah terlihat rapi disatu browser, namun ketika dicoba dibrowser lain malah jadi acak-acakan.

 

 

FUNGSI DARI CSS

Fungsi utama dari CSS adalah mendesain, merancang, merubah, dan juga membentuk halaman pada website ataupun blog dan isi dari halaman website itu ialah tag-tag HTML yang sederhana sehingga bisa menjadi lebih fungsional dan lebih menarik.

 

 

STRUKTUR DASAR CSS

1.Selector

Selektor adalah kata kunci untuk memilih elemen HTML yang akan diatur. Contoh:

Maksud dari sintax diatas bahwa kita memilih semua elemen H1 lalu diberikan warna teks merah.

Selektor dapat berupa nama tag, class, id, dan atribut. Contoh:

 

2. Blok Deklarasi

Blok deklarsi adalah tempat kita menuliskan atribut CSS yang akan diberikan kepada selector. Blok deklarasi diawali dengan tanda kurung buka“{“ dan diakhiri dengan tanda kurung tutup “}”.

 

3. Property dan Nilainya

Properti merupakan atribut atau sekumpulan aturan yang akan diberikan kepada elemen yang dipilih. Setiap properti harus diakhiri dengan tanda titik koma “;”. Namun apabila hanya terdapat satu properti saja, maka boleh untuk tidak menggunakan titik koma. Contoh: