CSS：あるクラスを別のクラスに上書きすることはできますか？

私はテンプレートクラスを持って、それは単純です：CSS：あるクラスを別のクラスに上書きすることはできますか？

.template{ 
    display: none;  
}

これは私が、私はjQueryのを使用して複製し、少し私の好みに合わせて編集することができますHTMLでブロックを作成することができます。しかし、私はクローン化されるために、この同じ要素に代入してきたクラスの一つは、設定します。

.Category{ 
    display:table-row-group; 
    //other properties not related to this problem not shown 
}

は、これはテンプレートクラス作りの全体の目的に反しテンプレート表示プロパティを、オーバーライド終わります。

確かに、クローン作成後にjQueryを使用してテンプレートクラスを削除すると同時にカテゴリクラスを追加することはできますが、HTMLの編集や変更が容易でなければならないという点代わりにjQueryコードの中にあります。

思考？私は多分私は他のプロパティまたはそのようなものをオーバーライドするためにディスプレイを教えることができると思っている？

ありがとうございました！

出典

2013-10-29 hughmanwho

によってサポートされていません。代わりに '

これはまさに!importantの機能です。あなたの価値にそれを加えてください。

出典

2013-10-29 14:40:42 SLaks

質問のためにCSSクラスに '！important'を追加することはできません。 –

追加！.Categoryには重要です。

.Category{ 
    display:table-row-group; 
    //other properties not related to this problem not shown 
}

出典

2013-10-29 14:43:19 schnawel007

.template.Category { 
    display: none; 
}

それとも使用が重要

.template { 
    display: none !important; 
}

出典

2013-10-29 14:43:24

2つのオプションがあります：！

推奨：CSSでクラス定義の順序は本当に重要では、必ずあなたが本当に欲しいクラスは、他のクラスを後にしているということです。
推奨しません：文章の末尾に!importantを使用してください。より複雑になる可能性があるため、これを上書きする必要がある場合は推奨されません。

出典

2013-10-29 14:46:00 DaniP

迅速な解決のために、あなたは、単にあなたのCSSルールをより具体的にすることができます。

body .Category{ 
    display:table-row-group; 
//other properties not related to this problem not shown 
}

あなたはこのコードを持って言うことができます：

<html> 
<head> 
    <style> 
    div{background-color:#ccc} 
    #content .Category{display:block;} 
    .template{display:none;} 
    .otherdiv{background-color:red;} 
    body .otherdiv{background-color:green;} 
</style> 
</head> 
<body> 
    <div id="content"> 
    <div class="template Category" >inner template div</div> 
    </div> 
    <div class="template">outer template div</div> 
    <div class="otherdiv">outer other div</div> 
</body> 
</html>

inner template divがブロックとして表示されますが、しかし、外側はできません。

より具体的には、あなたのCSSのルールは、より自然に重要です。 body .otherdivは、CSSの特異http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/

についてその記事は「、0から始まるスタイル属性1000を追加し、100を追加参照してください.otherdiv

よりも重要であるので、私のコードでは、DIV .otherdivは緑backgroupdで表示されます各IDに対して、各属性、クラスまたは擬似クラスに10を加え、各要素名または擬似要素に1を加えます。あなたのテンプレートを非表示にするNONE`：!importantを使用して

は `ディスプレイを使用しないでくださいすべてで推奨されていない、とすべてのブラウザ

出典

2013-10-29 14:53:50 Asenar

CSS：あるクラスを別のクラスに上書きすることはできますか？

関連する問題