Toggle_Sidebarの背景色を変更するCSSを見つけることができません

Question

このページでは、http://www.fkhv.org/「Giving To Fahrney Keedy」と表示されているトグルサイドバー - より際立った青の色合いにする必要があります。

私はスタイルシートを変更するために何を変更するのか分かりません。

助けが大好きです。

私はこれを試してみましたが、それは働いていない：

/* TOGGLE SIDEBAR */ 

.toggle_sidebar .switcher{ 
    background: #0000FF; 
} 

.toggle_sidebar .switcher{ 
    right: auto; 
    left: 0; 
    background: #0000FF; 
} 
.toggle_sidebar .switcher_shadow{ 
    right: auto; 
    left: 0; 
    -webkit-transform: translate(-50%, 0); 
    -moz-transform: translate(-50%, 0); 
    -ms-transform: translate(-50%, 0); 
    transform: translate(-50%, 0); 

Answer 1

CSSスタイルは、特異性の順序で適用されます。 .toggle_sidebarに背景を適用するCSSルールをすばやく調べると、ルールが巨大であることがわかります。私はそれを選ぶことさえしようとしなかったが、あなたが私を必要とするならばできる。それはおそらくでそれを無効にするために私の意見では最も簡単な方法のような重要なので、：！

.toggle_sidebar, .switcher { 
    background-color:#0000FF !important; 
} 

Answer 2

あなたの問題はCSS styles specificity orderに関連しています。

可能な解決策の1つは、idスタイルがクラススタイルよりも優先順位が高いため、要素にidを追加してスタイルを適用することです。例えば

、以下のようにID（my-id）を追加することを検討：

<section class="toggle_sidebar" id="my-id"> 
    ... 
</section> 

必要に応じて、その後のスタイルを作成します。

#my-id { 
    background-color: red; 
} 

をそして、それは、所望の色を持っているあなたを有効にする必要があります。これは、!important（bad (or at least a last resort) practiceと見なされます）を使用するよりも良い方法です。