                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

float问题

栏目1

栏目2

为什么DIV2 没有颜色变化

qq_路人王_04192581

2016-10-19

源自：初识HTML(5)+CSS(3)-升级版 13-4

关注问题我要回答

694

操作

收起

9 回答

慕粉0817575176
2016-10-19

浮动脱离了文档流，，，，导致div2顶了上去被div覆盖了，如果你在div2中设置clear：both；就好了

0 回复有任何疑惑可以回复我~

Seamo
2016-10-19

两个div都得加浮动

0 回复有任何疑惑可以回复我~

Seamo
2016-10-19

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>浮动模型</title>

<style type="text/css">

#div1{

border:2px red solid;

width:100px;

height:100px;

float:left;

}

.div2{

border:2px blue solid;

width:100px;

height:100px;

float:left;

}

</style>

</head>

<body>

<div id="div1">栏目1</div>

<div class="div2">栏目2</div>

</body>

</html>

0 回复有任何疑惑可以回复我~

慕容9322320
2016-10-19

在div2里加一句 background-color: blue; ，看到变蓝的地方就是实际上div2的位置

0 回复有任何疑惑可以回复我~

lincon007
2016-10-19

#div1{

border:2px red solid;

width:100px;

height:100px;

}

.div2{

border:2px blue solid;

width:100px;

height:100px;

float:left;

}

要想有浮动效果，只有在下一个div才有效，所以这里应将#div1里的float属性加入.div2样式表，

如上面代码所示，希望帮到你

0 回复有任何疑惑可以回复我~

#1

qq_路人王_04192581 提问者

位置重叠了，那为什么元素内容，栏目1和栏目2没有重叠而是栏目2 在栏目1的下面

2016-10-19 回复有任何疑惑可以回复我~

hugooood
2016-10-19

栏目2默认在左上角了，所以位置与栏目1的重叠了，只显示栏目1，你改一改栏目2的位置就好了

0 回复有任何疑惑可以回复我~

#1

qq_路人王_04192581 提问者

位置重叠了，那为什么元素内容，栏目1和栏目2没有重叠

2016-10-19 回复有任何疑惑可以回复我~

慕莱坞9032836
2016-10-19

因为div2设置了浮动 div2的颜色被div1覆盖了你可以设div2的高度为200 颜色就出来了

0 回复有任何疑惑可以回复我~

qq_whateverwher_0
2016-10-19

div2 代码里加上float就可以显示了

0 回复有任何疑惑可以回复我~

慕粉1847494851
2016-10-19

两个div重叠了，你写个float:right;试下就知道了。

0 回复有任何疑惑可以回复我~

举报

0/150

提交

取消

初识HTML(5)+CSS(3)-升级版

参与学习 1225771 人
解答问题 18234 个

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

本课相似问答

2 回答float的应用问题

3 回答Float疑问？

3 回答float后，其他元素排序问题

3 回答float

1 回答float

搜索更多本课相关问答

float问题

我要回答关注问题

意见反馈帮助中心 APP下载