CSSクラスを無限にオーバーライド

CSSアドバタイズメントのスタックオーバーライドはありますか？たとえば、すべてのオーバーライドに対して常にCSSオーバーライドがありますか？

私がこれを書いたとしましょう：

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>title</title> 
    <style> 
     .a { 
     color: red; 
     } 
     /* Override it again */ 
     div.a { 
     color: blue; 
     } 
     /* Again! */ 
     body div.a { 
     color: yellow; 
     } 
     /* Again!! :) */ 
     html body div.a { 
     color: yellow; 
     } 
     /* AND AGAIN!! */ 
     html body div.a { 
     color: pink !important; 
     } 
    </style> 
    </head> 
    <body> 
    <div class="a">a</div> 
    </body> 
</html>

は!importanthtml body div.adiv.aのための絶対的な最高レベルのオーバーライドと組み合わせていますか？
常に優先度の高いものが存在する必要がありますか？

出典

2016-06-01 sneilan

https://developer.mozilla.org/en-US/docs/Web/CSS/Specificityを参照してください。 – j08691

を適用します。

.foo.foo.foo { }

実際には、ブラウザでは最終的にセレクタがあまりにも多くのコンポーネントを持つとみなして無視します。

（任意のセレクタよりも明確なスタイル属性は、もあります）

出典

2016-06-01 21:15:29 Quentin

あなたはまったく正しいです！ https://jsfiddle.net/h0noz46t/これはそれを証明します。 – sneilan

インラインスタイリング!importantが適用されていますが、これまでに使用した中で最も高いオーバーライドです。

例： <div class="a" style="color: blue !important">a</div>は、他のすべてのCSSを上書きするには、あなたは、単に特異性を高めるためのルールを繰り返すことができます理論的には

出典

2016-06-01 21:14:49 mcky

あなたはそれがまだ<style>タグで宣言されたルールを上書きします!important宣言でdiv.aのためのインラインスタイル規則を宣言した場合。

通常、インラインルールは、そのルールを指定するセレクタの数に関係なく、内部または外部で宣言されたスタイルを過度に修飾します。インラインルールが内部スタイルまたは外部スタイルで過度に修飾されているのは、!important宣言が使用されているときだけです。ただし、その宣言がインラインスタイルで使用されている場合、上書きして呪いをかけます。

この場合、属性をリセットするにはjavascriptを適用する必要があります。

出典

2016-06-01 21:24:02 UncaughtTypeError

CSSクラスを無限にオーバーライド

答えて

関連する問題