Bagaimana untuk Mengatasi Gaya Sebaris dengan !penting dalam CSS?

Mengatasi Atribut !important dengan CSS

Dalam pembangunan web, atribut !important sering digunakan untuk mengatasi peraturan CSS dan memastikan sifat gaya tertentu diutamakan. Walau bagaimanapun, bagaimana jika anda perlu mengatasi gaya sebaris yang sudah termasuk atribut !important? Adakah terdapat cara untuk melakukan ini?

Cabaran: Mengatasi Gaya Sebaris dengan !penting

Pertimbangkan kod HTML berikut:

<code class="html"><div style="display: none !important;"></div></code>

Dalam contoh ini, < ;div> elemen ditetapkan untuk disembunyikan dan atribut !important memastikan bahawa sifat ini tidak boleh ditindih oleh peraturan CSS berikutnya.

Penyelesaian: Menggunakan Pemilih Kelas dan !important

Untuk mengatasi gaya sebaris dengan atribut !important, anda boleh menggunakan pemilih kelas. Begini caranya:

• Tambahkan kelas pada elemen:

<code class="html"><div class="override" style="display: none !important;"></div></code>

• Sekarang, buat peraturan CSS yang menyasarkan pemilih kelas dan termasuk !important atribut:

<code class="css">.override {
  display: block !important;
}</code>

Peraturan CSS ini akan mengatasi gaya sebaris dan menjadikan