css - img プロパティのグローバル スタイルの有効化

Question

私の css ファイルには、すべての画像に適用されるプロパティ (以下を参照) があります。

img{height:auto;max-width:100%;}

これを適用したくない特定の div に画像があります。新しいイメージ クラスを割り当てることができますが、上記のグローバル クラスは引き続き有効です。

グローバル img がこの div 内の画像に適用されないようにする方法はありますか?

Answer 1

新しい画像クラスで !important プロパティを使用します。

.auto-width {
    max-width: none !important;
}

また、CSS ファイルはカスケードなので、標準のイメージ クラスの後に新しいイメージ クラスを配置すると、!important ステートメントを使用せずに最大幅をオーバーライドできます。

Answer 2

はい、ルールをより具体的にすると、次のように原始的になります。

div.contenedor img {
  height:10%;
  max-width:50%;
}

これも他のルールの後に設定します。

以前のすべてのプロパティを変更する必要があります

Answer 3

プロパティをデフォルトにリセットしたい。height: autoはとにかくデフォルトなので、取り除く必要があるのは だけでmax-width、これを に設定する必要がありますnone。

div.auto-width img {
    max-width: none;
}

このセレクターは特異性 ( 0021vs 0010) が高いため、元の定義をオーバーライドします。