Bagaimanakah Saya Boleh Menggayakan Elemen dengan Nama Kelas Bermula dengan Rentetan Khusus dalam CSS?

Menggayakan Elemen dengan Nama Kelas Bermula dengan Rentetan Khusus

Dalam CSS3, adalah mungkin untuk menggunakan kad bebas untuk memadankan elemen yang nama kelasnya bermula dengan rentetan tertentu. Ini membolehkan anda menggayakan berbilang elemen dengan nama kelas yang serupa dengan cara yang ringkas dan cekap.

Pertimbangkan struktur HTML berikut:

<div class="myclass-one"></div>
<div class="myclass-two"></div>
<div class="myclass-three"></div>

Untuk menggayakan semua div ini dengan warna yang sama, kita boleh menggunakan peraturan CSS berikut:

div[class^='myclass'], div[class*=' myclass'] {
    color: #f00;
}

Begini cara peraturan ini berfungsi:

• class^='myclass' sepadan dengan semua elemen yang nama kelasnya bermula dengan rentetan "myclass." Dalam kes ini, ia akan memilih tiga div yang dinyatakan di atas.
• class*=' myclass' sepadan dengan semua elemen yang nama kelasnya mengandungi subrentetan "myclass" di mana-mana sahaja di dalamnya. Ia juga akan memilih tiga div.

Warna: #f00; sifat menetapkan warna semua elemen yang dipilih kepada merah.

Dengan menggunakan pendekatan kad bebas ini, anda boleh mengemas kini gaya berbilang elemen dengan nama kelas yang serupa dengan mudah tanpa perlu menentukan setiap nama kelas individu dalam peraturan CSS.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggayakan Elemen dengan Nama Kelas Bermula dengan Rentetan Khusus dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!