2016-06-21 49 views
1

に適切にIDを割り当てるとの問題は、私はコードをしようと、この問題を抱えていることだサブリスト内のアイテムに適用さに、私はCSS

<nav class="horizontal" id="horizontal"> 
      <ul> 
       <li><a href="#">Home</a></li> 
       <li><a href="#">Menu</a></li> 
       <li><a href="#">Locations</a></li> 
       <li><a href="#">Catering</a></li> 
       <li><a href="#">About Us</a></li> 
      </ul> 

これがなければなりません今度は私が理由を知りたいのですが..私はそれが他のスタイル規則と協力しているとして、ファイルが私のHTMLドキュメントにリンクされている知っているので、

#horizontal > li { 
    background-color: white; 
    font-size: 16px; 
    height: 50px; 
    line-height: 50px; 
    width: 180px; 
    display: inline-block; 
    horizontal-align: left; 

としての私のCSSファイルに変換するオーバー。どんな助けもありがとう。

また、サイドノート:このスニペット用

display: inline-block; 
horizontal-align: left; 
} 

私はここに行くしようとしている効果がブロックとしてアイテムを表示し、左にフロート、私が知りたいことですもし私がそのコードで正しい軌道にいるならば。

最後に、私はどちらのような私のリストのために働くように見えるんよう、フォント色および/またはテキストの色の性質の問題を持っているように見える:背景色の変更

#horizontal > ul > li > a:hover { 
    background-color: rgb(255,101,101); 
    text-color: black; 

が、テキストは同じままです。

+1

'#horizo​​ntal> li'を' #horizo​​ntal> ul> li'に変更します – RockMyAlgorithm

答えて

3

#horizontal > li

場合> li外観およびLI要素IDを持つ親要素とhorizontal

>オペレータが直接子孫を探し(より大きい)親要素。あなたの例では、#horizontalが親要素であり、直系子孫がULです。

したがって、LIに期待される効果は適用されません。

あなたは

#horizontal li、または#horizontal ul li、またはより高い特異量を有する#horizontal > ul > liを使用することができます。

関連する問題