Sintaks CSS: Cara Membuat Kode CSS

Sintaks CSS: Cara Membuat Kode CSS - Kang Endi

Sintaks CSS terdiri dari serangkaian aturan. Aturan-aturan ini memiliki 3 bagian: selektor, properti, dan nilai.

Anda tidak perlu mengingat hal ini untuk mengode CSS. Setelah Anda mulai mengode CSS, Anda akan melakukannya tanpa berpikir "ini selektor" atau "itu properti". Hal ini akan mulai masuk akal setelah Anda mempelajari contoh-contoh di halaman ini.

Sintaks:

selektor { properti: nilai }

Selektor mewakili elemen HTML yang ingin Anda beri gaya. Contoh:

h1 { color: blue }

Kode ini memberi tahu browser untuk menampilkan semua kemunculan elemen HTML <h1> dalam warna biru.

Pengelompokan Selektor

Anda dapat menerapkan gaya ke banyak selektor jika diinginkan. Pisahkan selektor dengan koma.

h1, h2, h3, h4, h5, h6 { color: blue }

Menerapkan Beberapa Properti

Untuk menerapkan lebih dari satu properti, pisahkan setiap deklarasi dengan titik koma.

h1 { color:blue; font-family: arial, helvetica, "sans serif" }

Keterbacaan

Anda dapat membuat kode CSS Anda lebih mudah dibaca dengan menyebarkan deklarasi gaya ke beberapa baris. Anda juga dapat membuat kode Anda menjorok ke dalam jika diinginkan. Hal ini tidak memengaruhi cara kode Anda dirender, hanya membuatnya lebih mudah dibaca.

h1 {
  color: blue;
  font-family: arial, helvetica, "sans serif";
  font-size: 150%;
}

Oke, Anda sekarang telah mempelajari sintaksis CSS. Lalu, bagaimana cara menggabungkan sintaksis ini ke dalam situs web Anda? Pelajaran selanjutnya akan menunjukkan cara menggabungkan CSS ke dalam dokumen HTML Anda.

Lebih baru Lebih lama