Mengenal CSS serta perannya dalam mempercantik tampilan website.

Kalian pasti pernah melihat sebuah website dengan tampilan yang cantik. Jika dibandingkan dengan yang sebelum-sebelum ini kita buat, tentunya jauh berbeda. Kita hanya memberikan teks, gambar, dan media yang tidak beraturan tata letaknya. Berbeda dengan website yang memiliki tata letak yang rapi. Apa yang digunakan ya sampai bisa seperti itu? Singkat saja, setelah selesai menyusun kerangka HTML, mereka menambahkan CSS sebagai “gaya” atau “style” nya. Namun, bagi yang belum paham apa itu CSS, mari kita bahas disini.

Pengertian

Pada tahun 1996, World Wide Web Consortium membuat dan mengembangkan CSS ini. Cascading Style Sheet atau yang biasa kita singkat dengan CSS adalah sekumpulan sintaks yang berisikan atribut yang diberikan nilai untuk mengatur gaya atau tata letak dari elemen-elemen yang telah kita buat pada HTML.

Seperti yang pernah disinggung,  Jika diibaratkan, CSS akan diibaratkan sebagai kulit, rambut, dan beberapa organ yang tersedia pada tubuh kita sebagai “pembungkus” dari tulang (HTML) atau bahasa kerennya, sih “skin”. Namun, hanya dengan HTML dan CSS saja, kita tidak bisa menyebut sebuah website menjadi interaktif karena CSS hanya bertugas untuk mendesain saja.

Peranan dan Fungsi CSS

Seperti yang telah dijelaskan diatas, Cascading Style Sheet berperan penting untuk membuat website kita menjadi lebih menarik dan tentunya tidak membosankan. Sebenarnya, hal yang sama bisa kita terapkan pada HTML itu sendiri, sayangnya hal tersebut membuat code kita berantakan dan atribut yang tersedia pun sangat terbatas. Maka dari itu, kita perlu memisahkan antara kerangka utama dan juga style nya.

Cascading Style Sheet ini memiliki sebuah keunikan yakni : satu buah style bisa diaplikasikan untuk banyak HTML, dan sebuah HTML bisa memiliki style yang berbeda-beda dengan CSS yang berbeda. Adapun fungsi lain daripada CSS yakni : Mempercepat proses loading sebuah website, variasi style yang beragam, dan merapikan tampilan.

Cara Kerja

Ketika akan mendesain sebuah file HTML menggunakan Cascading Style Sheet, pertama-tama kita perlu menghubungkan dulu melalui tag link pada bagian head, atau kita bisa sisipkan tag <style> pada bagian head (cara yang kedua tidak disarankan karena akan mengotori file utama html).

Adapun sintaks penulisannya yakni

tag{properti : value;}

Setelah keduanya terhubung, ketikkan tag yang ingin kalian berikan style. contohnya kalian ingin memberikan style pada paragraf, maka sintaks yang ditulis adalah p{ text-align : center;} browser akan membaca dan menjalankan sintaks tadi dengan mengubah paragraf ditengah-tengah.

Intinya, cara kerjanya adalah : browser akan menganalisa style yang kalian masukkan pada CSS yang terhubung pada file HTML, lalu menerapkannya pada saat kalian membukanya pada browser.

 

 

Baiklah, mungkin sekian artikel yang bisa kita bahas kali ini, sampai jumpa pada artikel selanjutnya! Tetap semangat dan jangan pernah menyerah untuk belajar!