Bagaimana cara mengesampingkan! Penting?

Saya telah membuat lembar gaya khusus yang menimpa CSS asli untuk templat Wordpress saya. Namun, pada halaman kalender saya, CSS asli memiliki ketinggian setiap set tabel dengan !importantdeklarasi:

td {height: 100px !important}

Apakah ada cara saya bisa menimpanya?

Mengganti pengubah penting!

1. Cukup tambahkan aturan CSS lain dengan !important, dan beri pemilih spesifisitas yang lebih tinggi (menambahkan tag, id, atau kelas tambahan ke pemilih)
2. tambahkan aturan CSS dengan pemilih yang sama di titik yang lebih baru dari yang ada (dalam dasi, yang terakhir didefinisikan menang).

Beberapa contoh dengan spesifisitas lebih tinggi (pertama adalah tertinggi / override, ketiga adalah terendah):

table td    {height: 50px !important;}
.myTable td {height: 50px !important;}
#myTable td {height: 50px !important;}

Atau tambahkan pemilih yang sama setelah yang ada:

td {height: 50px !important;}

Penolakan:

Ini hampir tidak pernah merupakan ide yang baik untuk digunakan !important. Ini adalah rekayasa buruk oleh pembuat template WordPress. Dengan gaya viral, ini memaksa pengguna templat untuk menambahkan !importantpengubah mereka sendiri untuk menimpanya, dan membatasi opsi untuk menimpanya melalui JavaScript.

Tapi, penting untuk mengetahui cara menimpanya, jika Anda kadang harus melakukannya.

The !importantseharusnya hanya digunakan ketika Anda memiliki pemilih dalam lembar gaya Anda dengan bertentangan spesifisitas .

Tetapi bahkan ketika Anda memiliki spesifisitas yang saling bertentangan, lebih baik untuk membuat pemilih yang lebih spesifik sebagai pengecualian. Dalam kasus Anda, lebih baik memiliki classHTML Anda yang dapat Anda gunakan untuk membuat pemilih yang lebih spesifik yang tidak memerlukan !importantaturan.

td.a-semantic-class-name { height: 100px; }

Saya pribadi tidak pernah menggunakan !importantstyle sheet saya. Ingat bahwa C dalam CSS adalah untuk cascading. Menggunakan !importantakan merusak ini.

Penafian: Hindari! Penting apa pun risikonya.

Ini adalah peretasan yang kotor dan kotor, tetapi Anda dapat menimpa yang penting, tanpa yang penting, dengan menggunakan animasi (berulang tanpa henti atau sangat tahan lama) di properti yang Anda coba timpa pada importir.

@keyframes forceYellow {
  from {
    background-color: yellow;
  }
  to {
    background-color: yellow;
  }
}

div {
  width: 100px;
  height: 100px;
  margin: 0 auto;
  background: red !important;
  animation: 1s linear infinite forceYellow;
}

<div></div>

Oke di sini adalah pelajaran singkat tentang Pentingnya CSS. Saya berharap bahwa di bawah ini membantu!

Pertama-tama setiap bagian dari nama gaya sebagai pembobotan, sehingga semakin banyak elemen yang Anda miliki yang berhubungan dengan gaya itu, semakin penting hal itu. Sebagai contoh

#P1 .Page {height:100px;}

lebih penting daripada:

.Page {height:100px;}

Jadi saat menggunakan yang penting, idealnya ini hanya boleh digunakan, padahal benar-benar dibutuhkan. Jadi untuk mengatasi decleration, buat style lebih spesifik, tetapi juga dengan override. Lihat di bawah:

td {width:100px !important;}
table tr td .override {width:150px !important;}

Saya harap ini membantu!!!

Ganti menggunakan JavaScript

$('.mytable td').attr('style', 'display: none !important');

Bekerja untukku.

Ini juga bisa membantu

td[style] {height: 50px !important;}

Ini akan mengesampingkan gaya inline apa pun

Dalam hal apapun, Anda dapat mengganti heightdengan max-height.

Saya ingin menambahkan jawaban untuk ini yang belum disebutkan, karena saya telah mencoba semua hal di atas tetapi tidak berhasil. Situasi spesifik saya adalah bahwa saya menggunakan semantic-ui, yang telah membangun !importantatribut pada elemen (sangat menjengkelkan). Saya mencoba segalanya untuk menimpanya, hanya pada akhirnya satu hal berhasil (menggunakan jquery). Itu adalah sebagai berikut:

$('.active').css('cssText', 'border-radius: 0px !important');