2016-04-13 21 views
1

これを外部のCSSファイルに書き込むと、 'a'というテキストが緑色になります。外部CSSは動作しませんが、インラインスタイリングは機能します

.ink-navigation ul.menu.black li ul.submenu li a { 
    color: green; 
} 

が、これは

<nav class="ink-navigation"> 
    <ul class="menu black"> 
    <li> 
     <ul class="submenu"> 
     <li> 
      <a href="#" title="" style="color:green">This is a text</a> 
     </li> 
     </ul> 
    </li> 
    </ul> 
</nav> 

の作品は、外部CSSが動作しない理由を誰もが知っていますか?

+3

あなたのHTMLを投稿するには、おそらく 'href'パスを修正する必要があります。 – Brian

+1

@Brianは、ファイルにリンクして、' head'要素を調べて問題のファイルを探していることを確認しました。右クリックし、新しいタブで開き、開いているかどうかを確認します。私が考えることができる唯一の他の問題は、それがオーバーライドしているということです。 –

+0

外部CSSが正しく設定されていれば、そのテキストの色だけが変更されたときに他のプロパティの変更を変更しません。また、色を置く:緑!重要; CSSの下部には機能しませんでした。 –

答えて

0

CSSは順番に実行されます。したがって、CSSの下部にあるルールは優先順位が高く、以前のルールより優先されます。また、インラインCSSはスタイルシートの後に実行され、最後に表示されるため優先されます。

簡単な修正は、例えば...色に重要な追加することです:

  • color: green!important;
  • サイドノートで

、私は非常にあなたが削除することによって、あなたのコードを削減することをお勧めしますこのような問題に実際に寄与する不要な膨らみ。 .ink-navigationがユニークな場合は、現在のフォーマットを使用する必要はありません。 .ink-navigation ul li ul li a {}または.ink-navigation .submenu a {}を使用してください。しかし、既存の規則がより大きい形式であれば、より短い形式を上書きするので、コードを短くしたい場合はすべての箇所に対処することが重要です。

0

あなたのcss外部ファイルをどこに添付しましたか?

あなたのヘッダーでこのような何かほとんどの外部CSSをあなたのHTMLにに正しくリンクされていません

 <link rel="stylesheet" type="text/css" href="CSS/cssFile.css"> 
+0

これであなたのCSSファイルは、CSSというフォルダのプロジェクトルートのサブディレクトリにあるはずです。そして、スペースで区切られたクラス名のためにアンダースコアを使用してください...... .ink-navigation ul.menu_black li ul.submenu li a。 .submenu> liメソッドを呼び出すだけで、クラスにアクセスすることもできます。 – MakDo

+0

外部CSSが正しく設定されていれば、そのテキストの色のみが変更されません。 –

+0