更新:只需要在父元素上触发BFC就好了。
在设定了float浮动属性元素的父级元素标签上清除浮动就好了。
示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.content {
background: red;
}
h3, p {
float: left;
}
p {
margin-top: 1rem;
}
.clearfix:after,
.clearfix:before {
content: '';
display: table;
}
.clearfix:after {
clear: both;
}
</style>
</head>
<body>
<div class="content clearfix">
<h3>我是标题我是标题</h3>
<p>我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本</p>
<p>我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本我是文本</p>
</div>
</body>
</html>