Komentar: HTML5 telah menambahkan pemilih CSS baru dan kategori semu. Artikel ini telah menyusun beberapa dan memberikan pengantar sederhana untuk digunakan. Teman yang menyukai HTML5 dapat merujuknya. Saya harap ini akan membantu semua orang.
Pemilihp [name^= my] {font-size: 14px}
Selector ^= aturan diterapkan untuk semua tag elemen <p> dengan atribut nama dimulai dengan saya
p [name $ = my] {font-size: 14px}
Selector $ = aturan berlaku untuk semua atribut nama yang diakhiri dengan tag elemen <p> saya
p [name*= my] {font-size: 14px}
Selector $ = aturan diterapkan ke semua atribut nama yang berisi elemen <p> yang diakhiri dengan saya
Selector>, +, ~
Pemilih> berarti bahwa elemen yang terkena adalah anak dari elemen pertama.
Pemilih + Pemilih ini mengacu pada elemen segera mengikuti elemen, dan kedua elemen ini harus memiliki induk yang sama.
Pemilih ~ mirip dengan +, tetapi elemen yang terkena tidak harus mengikuti elemen pertama.
Tambahkan nama kelas semu dan elemen referensi:
Contoh: MyClass: Nth-Child (2)
Elemen kedua dalam elemen myclass
Kata kunci aneh, bahkan
myclass: nth-child (ganjil): mempengaruhi posisi indeks elemen induknya dengan angka ganjil
myclass: nth-child (even): mempengaruhi posisi indeks elemen induknya bahkan
<tyle>
.Test: nth-child (ganjil)
{
Warna: Biru;
}
. Test: nth-child (even)
{
Warna: Merah;
}
. Test: nth-Child (2)
{
Warna: Hijau;
}
</tyle>
<div>
<p>
1
</p>
<p>
2
</p>
</div>
<p>
1
</p>
<p>
2
</p>
<p>
1
</p>
<p>
2
</p>
Efeknya adalah sebagai berikut:
1
2
1
2
1
2
Negasi kelas semu
: not (p) {color: red}
Semua elemen lain kecuali elemen <p> merah