Bagaimanakah Saya Boleh Menggayakan Elemen Berdasarkan Kedua-dua ID dan Kelasnya dalam CSS?

Menggabungkan Kelas dan ID dalam Pemilih CSS

Anda mungkin menghadapi situasi di mana anda perlu menggayakan elemen berdasarkan kedua-dua atribut kelas dan ID mereka. Walaupun mudah untuk menggunakan satu atribut pada satu masa, menggabungkannya boleh kelihatan mengelirukan.

Mari kita pertimbangkan kod HTML berikut:

<div class="sectionA">
<p><strong>Adakah mungkin untuk menentukan gaya yang terpakai khusus untuk "div dengan></strong></p>
<p>Terdapat dua cara untuk mencapai ini:</p>
<ol><li>
<strong>Gunakan ID gabungan dan pemilih kelas:</strong> Dalam helaian gaya anda, tulis yang berikut:</li></ol>
<pre class="brush:php;toolbar:false">div#content.myClass

Sintaksi ini bermaksud bahawa peraturan akan digunakan pada

elemen yang mempunyai nilai atribut ID "kandungan" dan nilai atribut kelas "myClass".

2. Buat nama kelas yang menggabungkan kedua-dua pengecam: Daripada menggunakan atribut kelas dan ID yang berasingan, anda boleh mencipta satu nama kelas yang mewakili gabungan yang diingini. Sebagai contoh, anda boleh menggunakan:

<div class="content-sectionA">
<p>Pendekatan ini menggabungkan kefungsian kedua-dua ID dan kelas atribut menjadi pengecam tunggal.</p>
<p><strong>Nota:</strong></p>
<ul>
<li>Anda boleh merantai berbilang nama kelas atau pemilih ID untuk menentukan kombinasi yang lebih khusus.</li>
<li> Dalam penyemak imbas moden, penggunaan nama teg dalam pemilih tidak diperlukan atas sebab prestasi. Walau bagaimanapun, adalah disyorkan untuk menggunakannya dengan berhati-hati.</li>
</ul>
</div>