！重要な修飾語を使用せずに変更する - 特異性のルール？

私はそうのようなFoo.ascx内のdivを持っている：！重要な修飾語を使用せずに変更する - 特異性のルール？

<div id="myIdentifier" class="myCssClass">

それはのserveral DPanelsにネストされている、など私は80pxに、このdiv要素の高さを設定する必要があります。私がheight: 80px;をmyCssClassに追加すると、動作しません。重要な修飾子をそのコード行に追加してheight: 80px !important;にすると動作します。私は、重要な修飾子を使わずに高さを変更するか、必要がある理由を理解する必要があります（できれば）。

myIdentifier（したがってdiv）への他の参照は、FooBehavior.js内にあります。 FooBehavior.js内で発生するのは、子要素を追加して幅を変更することだけです。

アイデアやアイデアはありますか？

出典

2017-02-04 andyCoder123

あなたのCSSのすべてを含める必要があります。あなたは、より高い特異性を持つページ上に他のCSSを持っています。他のルールがわからない場合は、CSSプロパティの特異性を高める方法を教えてください。 –

要素を右クリックして[inspect]を選択すると、ブラウザの開発ツールが開きます。要素を選択すると、それに適用されるCSSルールが表示され、どのルールがあなたのものよりも優先されているかを見ることができます。そのルールが見えたら、より具体的に変更する必要があります。しかし、他のルールが何であるかを知らなくても、あなたのルールが何である必要があるのかを明確に言うことはできません。 –

ブラウザのスタイルインスペクタを使用して、どのルールがあなたの 'myCssClass'ルールをオーバーライドしているかを見てください。それは、これよりも具体的にルールを作るためにあなたが何をする必要があるのかを示します（または、それと同じですが、後に定義されます）。ただし、IDの規則はかなり特定的なものなので、 '＃myIdentifier.myCssClass {height：80px; } 'で十分かもしれません。 –

あなたはこのように、強力な定義を使用することができます。

まず第1の「クラスmyCssClassを持つdiv要素の子」である第二は、「クラスmyCssClassを持っているdiv要素」である、ちょうどクラス識別子でありますそしてそう..に

.myCssClass { 
 
    width: 550px; 
 
    height: 550px; 
 
    background-color: black; 
 
    } 
 

 
div .myCssClass { 
 
    background-color: blue; 
 
    } 
 

 
div > .myCssClass { 
 
    background-color: yellow; 
 
    }

<div id="parent"> 
 

 
    <div id="myIdentifier" class="myCssClass" /> 
 
    
 
</div>

出典

2017-02-04 16:47:43 webmaster

！重要な修飾語を使用せずに変更する - 特異性のルール？

答えて

関連する問題