Bagaimanakah Saya Boleh Menyasarkan Elemen CSS dengan Atribut Sebarang Nilai?

Menyasarkan Elemen dengan Atribut Sebarang Nilai dalam CSS

Dalam CSS, selalunya perlu untuk menyasarkan elemen berdasarkan atributnya. Walaupun mudah untuk memilih elemen dengan nilai atribut tertentu, elemen penyasaran dengan nilai atribut arbitrari boleh menjadi lebih mencabar.

Soalan: Memilih Elemen dengan Atribut Arbitrari

Bagaimana kita boleh elemen sasaran yang mempunyai atribut dengan sebarang nilai (kecuali apabila atribut itu belum ditambahkan pada elemen)? Sebagai contoh, kami ingin menyasarkan mana-mana teg penambat dengan nilai untuk atribut "rel".

Jawapan: Menggunakan Pemilih Atribut dengan Nilai Kosong

Untuk mencapai ini, kita boleh menggunakan pemilih atribut dengan nilai kosong. Peraturan CSS berikut menyasarkan mana-mana teg sauh dengan atribut "rel" yang ditakrifkan:

a[rel] {
    color: red;
}

Peraturan ini akan sepadan dengan teg sauh pertama dan ketiga dalam HTML berikut:

<a href="#" rel="eg">red text</a>
<a href="#">standard text</a>
<a href="#" rel="more">red text again</a>

Kemas kini: Membezakan Antara Nilai Kosong dan Tidak Kosong

Dalam kes tertentu, ia mungkin perlu untuk membezakan antara elemen dengan nilai atribut kosong dan yang mempunyai nilai bukan kosong. Untuk melakukan ini, kita boleh menggunakan kelas pseudo ":not" CSS:

a[rel]:not([rel=""]) {
    color: red;
}

Peraturan ini hanya akan menyasarkan teg sauh dengan nilai atribut "rel" bukan kosong.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyasarkan Elemen CSS dengan Atribut Sebarang Nilai?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!