Selama course ini, kita selalu bekerja dengan contoh yang sudah dipilihkan. Ketika mulai membangun proyek sendiri, pertanyaan baru akan muncul setiap hari: property apa yang mengatur jarak antar huruf, nilai awal (initial value) sebuah property apa, dan apakah sebuah fitur didukung seluruh browser. Kabar baiknya, semua jawaban resmi tersedia gratis dan tempatnya sudah disepakati komunitas web. Chapter ini memperkenalkan sumber rujukan utama CSS beserta cara memanfaatkannya dengan efisien.
MDN sebagai Kamus Utama CSS #
MDN Web Docs adalah rujukan kanonik untuk CSS. Hampir setiap property, selector, at-rule, dan konsep memiliki halaman tersendiri yang memuat sintaks, penjelasan nilai, contoh, serta tabel dukungan browser.
| Sumber | URL | Paling baik untuk |
|---|---|---|
| MDN CSS Reference | developer.mozilla.org/en-US/docs/Web/CSS | Kamus lengkap property, selector, dan at-rule CSS |
| MDN CSS Selectors | developer.mozilla.org/en-US/docs/Web/CSS/CSS_selectors | Daftar semua selector beserta contohnya |
| web.dev Learn CSS | web.dev/learn/css | Course terstruktur dengan ilustrasi dari tim Google |
Cara paling cepat membuka MDN: ketik mdn color atau css color mdn pada mesin pencari, dan halaman property color akan muncul di urutan atas. Kebiasaan kecil ini menghemat waktu dibanding menelusuri menu situs. MDN juga tersedia dalam Bahasa Indonesia untuk sebagian halaman, tetapi tautan pada chapter ini mengarah ke versi en-US karena versi tersebut paling lengkap dan paling cepat diperbarui.
Sumber Spesifikasi Resmi #
Di belakang MDN ada dokumen spesifikasi yang menjadi acuan resmi pembuat browser. Dua portal berikut berguna ketika kita ingin memastikan status sebuah fitur:
| Sumber | URL | Paling baik untuk |
|---|---|---|
| W3C CSS Portal | w3.org/Style/CSS | Ringkasan standar CSS dan daftar modul resminya |
| CSS Working Group Drafts | drafts.csswg.org | Draf spesifikasi terbaru, termasuk fitur yang belum stabil |
| web.dev Blog | web.dev/blog | Pengumuman fitur baru browser dan status Baseline |
Catatan penting: tulislah spesifikasi hanya sebagai sumber sekunder. Bahasanya teknis dan padat, sehingga MDN biasanya lebih nyaman untuk belajar. Ketika MDN dan spesifikasi tampak berbeda, spesifikasi adalah acuan akhirnya.
Pola Membaca Satu Halaman Referensi #
Hampir semua halaman property di MDN mengikuti struktur yang sama, sehingga kita cukup mempelajari polanya satu kali:
- Bagian Try it menyediakan contoh interaktif yang bisa langsung diubah.
- Bagian Syntax menampilkan bentuk nilai yang sah beserta kata kuncinya.
- Bagian Formal definition merangkum nilai awal, elemen yang berlaku, dan apakah property mewarisi (inherited).
- Bagian Browser compatibility menunjukkan dukungan tiap browser.
Ketika kamu membuka halaman yang belum pernah dibaca, telusuri keempat bagian itu secara berurutan. Pola ini berlaku juga untuk halaman selector dan at-rule.
Satu kebiasaan terakhir yang berdampak besar: tandai halaman-halaman yang paling sering kamu buka pada bookmark browser, dikelompokkan dalam satu folder bernama “CSS Reference”. Rujukan hanya berguna jika bisa diakses dalam dua klik saat sedang menulis kode.
Ringkasan #
MDN menjadi kamus harian, portal W3C dan draf CSS Working Group menjadi sumber standar resmi, sedangkan web.dev melengkapi keduanya dengan course dan berita fitur terbaru. Dengan mengenali struktur halaman referensi, kamu dapat menjawab pertanyaan CSS sendiri tanpa menebak-nebak. Chapter berikutnya berfokus pada bagian referensi yang paling sering dibuka: daftar lengkap selector beserta cara membacanya.