adydetra_
30 Nov 2023

Pengenalan CSS

Apa Itu CSS?

CSS adalah kependekan dari Cascading Style Sheets. HTML itu seperti kerangka bangunan rumah, lalu CSS ini seperti cat dan dekorasi yang bikin rumah jadi menarik dan mewah ✨.

Coba kamu perhatikan tampilan website saat ini dan tulisan 📝 yang dibaca, itu semua berkat CSS.

Sejarah CSS

Dulu, sekitar tahun 1990-an, web tuh masih polos banget. HTML udah ada, tapi cuma buat bikin struktur aja, gak bisa ngatur tampilan dengan keren. Makin lama, makin banyak web yang muncul, dan orang-orang butuh cara buat nge-styling web tanpa harus ribet nulis ulang kode HTML.

Di tahun 1996, muncullah CSS! Håkon Wium Lie dan Bert Bos yang bikin ini buat World Wide Web Consortium (W3C). Ide dasarnya simpel, buat aturan-aturan yang ngatur tampilan, lalu terapin aturan tersebut ke elemen HTML. Jadi gak perlu nulis kode styling berkali-kali.

Mulanya, CSS cuma bisa atur warna, font, dan margin aja. Tapi seiring waktu, CSS nya makin kece dan canggih. Sekarang udah bisa atur layout, animasi, dan segala macam.

Cara kerja

CSS bekerja saat sebuah browser membuka Halaman Website, pada saat itu browser harus menggabungkan konten dokumen dengan gaya informasi dalam halaman sebuah situs. CSS memiliki beberapa langkah cara kerja sebagai berikut:

  1. Load HTML, browser memuat HTML
  2. Parse HTML, penguraian HTML menjadi Document Object Model (DOM) dan memuat CSS.
  3. Load CSS, browser memuat tautan seperti gambar/video lalu CSS dimuatkan dan ditautkan.
  4. Parse CSS, penguraian CSS.
  5. Render Tree, penyeleksian tiap CSS yang akan digunakan ke Document Object Model (DOM)
  6. Display, CSS dan DOM akan membentuk tampilan visual sebuah halaman situs yang tertampil di layar monitor.