请问老师为什么

首页课程实战体系课手记专栏慕课教程

请问老师为什么

来源：2-8 清除浮动的四种解决办法

hy_wang

2017-12-10 20:02:13

请问老师这个怎么理解，浮动元素不是占有文本空间吗，为什么他说2中内容在浮动元素之上显示

写回答

2回答

好帮手慕糖

2017-12-11

已采纳

你好，不能很明确的理解你的意思，以下是测试代码可以参考下，块级元素浮动浮动的时候，正常流的元素背景会在浮动元素的背景之下显示，但是内容不会。这里有关浮动的特性：浮动会导致元素脱离文档流，同一级别下，设置了浮动元素，又没有设置层级，那么是浮动元素的层级高，即：浮动的元素会再上，建议：关于这里也可以自己书写代码测试下。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div{
width: 200px;
height: 200px;
}
.one{
background: red;
float: left;
}
.two{
height: 300px;
background: blue;
}
</style>
</head>
<body>
<div class="one">123</div>
<div class="two">456</div>
</body>
</html>

祝学习愉快~