overflow:hidden形成BFC和overflow:hidden溢出隐藏的关系
1.二者的关系是?
2.
相关代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.box {
width: 400px;
border: 10px solid #000;
/* float: left; */
/* display: inline-block; */
/* 利用overflow来形成BFC */
overflow: hidden;
}
.c1 {
width: 200px;
height: 200px;
background-color: orange;
float: left;
}
.c2 {
width: 200px;
height: 200px;
background-color: red;
float: left;
}
</style>
</head>
<body>
<div class="box">
<div class="c1"></div>
<div class="c2"></div>
</div>
</body>
</html>
没有加overflow之前是这样:
既然overflow属性会使溢出盒子边框的部分被隐藏
那为什么加上overflow:hidden之后这两个子盒子没有被隐藏,反而被大盒子撑起来了
20
收起
正在回答
2回答
同学你好,这样理解是可以的。祝学习愉快~
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星