Kombinasi dan Penyusunan Tutorial Menengah CSS

kombinasi

Anda tidak perlu mengulang beberapa selector dengan atribut yang sama, cukup pisahkan selector tersebut dengan koma (,).
Misalnya, Anda memiliki kode berikut:

jam2 { warna: merah; } .iniKelas Lain { warna: merah; } .yetAnotherClass { warna: merah; }

Kemudian Anda dapat menulis:

h2, .thisOtherClass, .yetAnotherClass { warna: merah; }

Bersarang

Jika CSS terstruktur dengan baik, tidak perlu menggunakan terlalu banyak kelas atau penyeleksi pengenal. Ini karena Anda dapat menentukan penyeleksi di dalam penyeleksi. (Atau lebih baik dikatakan, pemilih konteks - oleh penerjemah)
Misalnya:

#atas { warna latar: #ccc; bantalan: 1em } #atas h1 { warna: #ff0; } #atas p { warna: merah; berat font: tebal; }

Ini menghilangkan pemilih kelas atau pengidentifikasi yang tidak diperlukan jika diterapkan pada HTML seperti ini:

<div id="atas"> <h1>Kari coklat</h1> <p>Ini resep saya membuat kari murni dengan coklat</p> <p>Mmm mm mmmm</p> </div>

Hal ini karena, dengan menggunakan penyeleksi spasi setengah lebar bahasa Inggris, kami menentukan bahwa h1 di ID ID memiliki warna "#ff0", sedangkan p berwarna merah dan tebal.
Ini juga bisa sedikit rumit (karena mungkin ada lebih dari dua level, seperti di dalam, di dalam, di dalam, dll.). Anda perlu berlatih lebih banyak.