为什么把div里的元素设为浮动，background就没了？也就是div的height不随子级元素增大？ - WEB前端(UI)

编程论坛 → WEB开发 → 『 WEB前端(UI) 』 → 为什么把div里的元素设为浮动，background就没了？也就是div的height不随子级元素增大？

标题：为什么把div里的元素设为浮动，background就没了？也就是div的height不随子 ...

只看楼主

szchina

等　级：新手上路
帖　子：99
专家分：0
注　册：2012-7-31

楼主

问题点数：0 回复次数：3

为什么把div里的元素设为浮动，background就没了？也就是div的height不随子级元素增大？

为什么加了ul{float: left;}，div的background就失效了？我想知道原理。谢谢
<html>
<head>
<style type="text/css">
div{width: 80%;background: blue;}
ul{float: left;}
</style>
</head>
<body>
<div>
<ul><a href="#">首页</a></ul>
<ul><a href="#">DIV+CSS</a>
<li><a href="#">DIV1</a></li>
<li><a href="#">DIV2</a></li>
<li><a href="#">DIV3</a></li>
<li><a href="#">DIV4</a></li>
</ul>

搜索更多相关主题的帖子: 元素　 background　

2013-03-09 14:19

死神之吻

等　级：新手上路
帖　子：16
专家分：0
注　册：2013-3-18

第 2 楼

得分:0

div代表一块了固定位置，你给他设置了颜色，但是当它的子元素出现浮动属性之后虽然div还是其父元素但是ul却不继承DIV的背景颜色属性！

2013-03-18 19:46

诸葛修勤

等　级：贵宾
威　望：11
帖　子：549
专家分：1955
注　册：2010-10-28

第 3 楼

得分:0

流媒体

程序代码：

<html xmlns="http://www.>
    <head>
    <style type="text/css">
        body{
            margin : 0px;
            padding : 0px;
        }
        div{
            margin : 0px auto;
            padding : 5px;
            width : 900px;
            background : #ccc;
            height : auto;
            overflow : hidden;
            border : solid 1px yellow;
        }
        ul{
            float : left;
            list-style : none;
        }
        a{
            text-decoration : none;
        }
        li{
            float : left;
            padding-left : 10px;
        }
    </style>
    </head>

    <body>
        <div>
            <ul><a href="#">首页</a></ul>
            <ul>
                <li><a href="#">DIV1</a></li>
                <li><a href="#">DIV2</a></li>
                <li><a href="#">DIV3</a></li>
                <li><a href="#">DIV4</a></li>
            </ul>
        </div>
    </body>
</html>

2013-05-04 15:29

huangyong

来　自：湖北武汉
等　级：版主
威　望：20
帖　子：603
专家分：7
注　册：2006-7-21

第 4 楼

得分:0

</ul>标签后面加一个<div style="clear:both;"></div>清除浮动

2013-11-29 22:34

参与讨论请移步原网站贴子：https://bbs.bccn.net/thread-400258-1-1.html