HTMLのul背景色

3581 ワード
先端開発
質問説明:ulを使用してドロップダウンメニューを作成する場合、メニューバー(すなわちul)に背景色を付けるとbackground-colorが機能しないことがわかります.ul要素ボックスのサイズを確認すると、ボックスの高さは0です.
HTML: 
<div id="menuList">
        <ul>
            <li>    li>
            <li>    li>
            <li>    li>
            <li>    li>
        ul>
    div>

CSS: 
body,div,ul,li{
            margin: 0;
            padding: 0;
        }
        #menuList{
            margin:20px;
        }
        ul{
            list-style: none;
            background-color: gray;
        }
        ul li{
            float: left;
            padding: 0 5px;
            border-left: solid 1px black;
        }

解決策:ulは直接高さを制定していないため、その高さは中のliによって伸縮します.liは左フローティングを設定しているので、フローティングをクリアしてから背景色を表示します.1.フローティングをクリアすると、ulにoverflow:hiddenのスタイルを追加できます.2.または div， 
<div style="clear: both;">div>
PAT1012
IE 8以下でbackground-sizeをサポートしない互換案について