2016-07-16 7 views
0

私はプラグインとWordPressの助けを借りてウェブサイトを作成しています。プラグインはLearnDash, BuddyBossBuddyPanelです。以前は同じナビゲーションを維持するのに問題があります誰かがログインした後は、ログインするときにどのようにしたいのですが、手ではできません。!重要なCSS警告の使用

私はこのことについてBuddyBossからサポートスタッフの助けを借りてくれました。彼らは私に前に出会ったことのない警告を含むコードを私に渡しました。 {}内のコードの他の行が存在しない

color: #012243!important; 

は、警告がUse of !importantあります。

これを修正するにはどうすればよいですか?

+0

ここCSS http://stackoverflow.com/questions/9245353/what-does-important-in-css-mean –

+0

おかげで何をするか!重要な程度の答えだ@MohamedSobhy私はそれを今見てみましょう:) –

+0

TL; DR: '!important'を使うと、CSSの特定性を覆します。 '!important'ルールは、他の'!import'ルールでのみ上書きできますが、より具体的です。 '重要なルールを持つ'スタイルルール '重要なルール::'重要なルール '>'特定のルール '>'特別なルール 'の順です。 特異性は、 'div#myId'がセレクタとして' div'よりもより具体的であることを意味します。 –

答えて

1

important!修飾子の使用は多少なりとも推奨されませんが、ほとんどの場合、既定の設定を上書きする最も適切な方法です。したがって、あなたの場合は、おそらくデフォルトの色を上書きできる唯一の方法です。それが動作する場合は、それを使用してください。カラーコードと!importantの間にスペースを入れて、

ので
color: #012243 !important; 

また、私はそのルールを記述します。 importantを使用して

+1

これは決して最も適切な方法ではありません。特にテーマでは予期しない動作が発生する可能性があり、さらに多くの問題を変更する必要があります。セレクタを常にテーマと同じようにする方が良いです。その方法での継承と依存関係は保持されます。 –

+0

もちろん、安いテーマ(安価だが悪く開発されている)では、SassのようなCSSコンパイラを使用する可能性がないだけでなく、CMS部分のルックアンドフィールをカスタマイズするオプションもありません。私が見ることができるように、OPはあまり経験がないので、おそらく彼がquickfixをするための最良の解決策です。また、テーマ開発者はアドバイスをくれたので、そのテーマがどの程度うまく開発されているか想像してみてください。 – ceruleus

+0

_bad_を使用して別のものを正当化しないでください。 – LGSon

1

は当然の選択である、可能な場合にかかわらず、単にルールをコピーして、カスタムCSSに追加し、代わりに

div#higher { 
 
    color: yellow; 
 
    background: lightgray; 
 
} 
 

 
#higher { 
 
    color: blue; 
 
    background: lightgray; 
 
} 
 

 
div.high { 
 
    color: lime; 
 
    background: lightgray; 
 
} 
 

 
.high { 
 
    color: red; 
 
    background: lightgray; 
 
}
<div id="higher" class="high">Hey there</div>

あるいはさらに良いのspecificityを増やした後をロードテーマのCSS。

/* theme CSS rule */ 
 
.parent .child { 
 
    color: red; 
 
    background: blue; 
 
} 
 

 

 
/* custom CSS rule - loaded/ordered after */ 
 
.parent .child { 
 
    color: yellow; 
 
    background: lightgray; 
 
}
<div class="parent"> 
 
    <div class="child"> 
 
    Hey there 
 
    </div> 
 
</div>

関連する問題