jquery - 外側のクラスの CSS 表示が重要なテーブルの場合、内側の div を非表示にします

Question

css クラスにが含まれる外部 div を指定すると、jQuery を使用して外部 div を作成display:table !importantするか.hide()、外部 div のインラインスタイルをdisplay:none;

これは、「カスケード」スタイルシートの意味ですか? ;)

これまでにこれに遭遇したことがないことに本当に驚いています。display:table !important誰かがこの競合のメカニズムと、css クラスをいじりたくない場合に何をすべきかを説明できますか。

今、私は Mozilla でこれを見ています。

score 2 · Accepted Answer

!importantルールは他のスタイルルール (インラインのものも含む) をオーバーライドします!important。

その!importantルールをオーバーライドする唯一の方法は、別の!importantルール (カスケードの下位に発生するルール、またはより具体的なルール) を使用することです。

.hidden{
    display:none !important;
}

これで、このクラスを要素に適用できます。

$('#d1').addClass('hidden');

ここにデモンストレーションがあります: http://jsfiddle.net/YrEEk/4/

score 2 · Accepted Answer

これは、!important を使用する場合、最初の "display:table !important" によってオーバーライドされるため、!important なしでその後に何かを設定しても機能しないためです。

$('#d1').hide();

この行は、CSS プロパティ「display:none」を要素に追加するだけで、まだ「display:table !important」があるため機能しません。

必要に応じて、CSS を !important なしで「display:table」として設定します。

2 に答える 2