1

div タグ内のコンテンツに背景色を割り当てることができません。

私のhtmlファイルの中に...

<!doctype html>
<html>
    <head>
    <meta charset="utf-8">
    <title>Guitar Gods</title>

    <link href="guitargods_css.css" rel="stylesheet" type="text/css">
    </head>

    <body>
       <div id="header">
       <h1>Guitar Gods</h1>
       <ul>
           <li><a href="#">Home</a></li>
           <li><a href="#">Scales</a></li>
           <li><a href="#">Videos</a></li>
           <li><a href="#">Exercises</a></li>
       </ul>
       </div>
    </body>
</html>

私が持っている私のcssファイルの中に...

@charset "utf-8"; /* CSS ドキュメント */

h1 {
    color: blue;
}
#header {
    background-color: black;
    padding-left: 10px;
}
#header a {
    text-decoration: none;
    display: block;
}
#header ul {
    list-style-type: none;
    background-color: black;
}
#header ul li {
    float: left;
    padding-left: 5px;
    font:Georgia, "Times New Roman", Times, serif;
}

h1 の背景は黒ですが、リスト内のどのアイテムにも背景色が割り当てられていません。

ここで何が欠けているのかわかりません。これは本当に簡単なようです。

4

2 に答える 2

4

(リストアイテムから)フロートをクリアする必要があります。これを行う1つの方法は、に追加overflow: hiddenすること#header ulです。

于 2013-03-10T16:06:30.730 に答える
1

FirefoxまたはChromeを使用している場合は、h1要素を右クリックして要素を検査します。そのタグに適用されているCSSを確認できます。h1の背景色はいつでも別の色に設定できます。

于 2013-03-10T16:06:15.577 に答える