[已解决]关于CSS布局中的float问题

晚回家 · 发表于 2020-4-29 01:47:55

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

既然p元素和img元素都是浮动元素，会脱离文档流，那么为什么在div容器元素中添加一个元素就可以解决div容器的高度问题了呢？
我想的是浮动元素和普通元素会重叠

.news {
  background-color: gray;
  border: solid 1px black;
  }

.news img {
  float: left;
  }

.news p {
  float: right;
  }

.clear {
  clear: both;
  }

<div class="news">
<img src="news-pic.jpg" />
<p>some text</p>
[b]<div class="clear"></div>[/b]
</div>

最佳答案

月排行榜 / 总排行榜

不二如是

2020-4-29 08:40:38

如果你想采取 float 布局，这个就是“套路”记住就好...

都是 BFC 机制在起作用

跳转到最佳答案楼层

weiter · 发表于 2020-4-29 08:27:04

可能是两个元素的宽度加在一起撑大了……我也有点好奇是为什么，每次都得两个元素，不然出来的效果不忍直视……

不二如是 · 发表于 2020-4-29 08:40:38

如果你想采取 float 布局，这个就是“套路”记住就好...

都是 BFC 机制在起作用

ryh320 · 发表于 2020-4-29 16:51:56

你div的高度都是有内容撑起来的

账号		自动登录	找回密码
密码			立即注册