Css Dasar

Contoh CSS rule:

property: value
property ialah properti CSS, dan value ialah nilai properti CSS yang tersesuaikan.

CSS rule di atas yang memperlihatkan properti ialah color dan font-size, di mana masing-masing nilainya red dan 20px berturut-turut.

Selector
Setiap elemen HTML, pengenal CLASS, dan pengenal ID dimungkinkan menjadi selector, dan selector itu dapat diberikan efek dari deklarasi-deklarasi yang ada.

CSS rule di atas yang memperlihatkan selector ialah elemen P.

Declaration
Declaration ialah bab dari CSS rule yang berisi satu properti CSS dan nilainya, jikalau menetapkan lebih dari satu declaration dalam blok declaration yang sama, diharuskan menyisipkan tanda titik koma di antara declaration satu dengan yang lainnya.

CSS rule di atas, yang memperlihatkan declaration ialah color: red; dan font-size: 20px;, di mana color: red; ialah declaration yang pertama dan font-size: 20px; ialah declaration yang kedua di dalam urutan.

Declaration block
Declaration block dimulai dari tanda “{” dan diakhiri dengan tanda “}”. Untuk CSS rule di atas, yang menujukkan declaration block adalah:

Class selector
Class selector akan memperlihatkan efek declaration CSS bagi semua elemen HTML yang mempunyai atribut CLASS dengan nilai yang tersesuaikan. Untuk jelasnya mengenai Class selector, silahkan ke halaman Class selector CSS.

ID selector
ID selector akan memperlihatkan efek declaration CSS hanya untuk satu elemen HTML yang mempunyai atribut ID dengan nilai yang tersesuaikan. Untuk jelasnya mengenai ID selector, silahkan ke halaman ID selector CSS.

Group selector
Di CSS di perbolehkan mengelompokkan selector untuk mendapat efek yang sama, contohnya ingin memperlihatkan efek yang sama untuk elemen H1, H2, H3, H4, H5, dan H6:

Contextual selectors
Semisal menjumpai CSS rule ibarat ini:

CSS rule di atas mengakibatkan semua elemen B yang tersarang di dalam elemen P akan diberikan efek untuk teksnya dengan warna merah.

Semisal lagi menjumpai CSS rule sebagai berikut:

CSS rule di atas mengakibatkan semua elemen B ber-CLASS myClass yang tersarang di dalam elemen P, untuk teksnya diberikan efek warna merah.

Comments
Untuk menetapkan komentar di CSS, dapat mengawalinya dengan tanda /* dan diakhiri tanda */.

Contoh: