css如何清除浮动(五)

接下来,我们介绍第一种新的清除浮动的方法,设置overflow:hidden。那它是什么意思呢?

overflow就是“溢出”的意思,hidden就是“隐藏”的意思。

1overflow:hidden;

表示“溢出隐藏”。所有溢出边框的内容,都要隐藏掉。

overflow本意就是清除溢出到盒子外面的文字。但是,前端开发工程师又发现了,它能做偏方。也就是overflow也可以用来清除浮动

一个父亲不能被自己浮动的儿子,撑出高度。但是,只要给父亲加上overflow:hidden;那么,父亲就能被儿子撑出高了。这是一个偏方。

运行结果:

可以看出,此时div没有设置高度,而且三个p标签也设置浮动,所以div的没有撑出高度。为了清除浮动,我们可以对div设置overflow:hidden;

运行效果如下:

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,806评论 1 92
  • 盒子中的区域 一个盒子中主要的属性就5个:width、height、padding、border、margin。w...
    Demo_Yang阅读 704评论 0 2
  • 标准文档流 一.标准流中的微观现象: 1>空白折叠现象 2>高矮不齐,底边对齐如果又有图片且图片参差不齐的,又有文...
    flowerflower阅读 10,194评论 2 16
  • 浮动的几个重要性质 首先,浮动有几个很重要的性质 脱标:脱离标准文档流 贴边(浮动会紧贴着浮动方向的边 字围(浮动...
    赵镇阅读 1,009评论 2 22
  • 和你表白刚刚好半年。 时好时坏不冷不热的关系让我很难过。 你是年少的欢喜,喜欢的少年是你。 有时候我会想,你这么优...
    林夕欧尼阅读 298评论 0 0