clearfix清除浮动

最新推荐文章于 2024-05-31 21:34:09 发布

原创最新推荐文章于 2024-05-31 21:34:09 发布 · 216 阅读

0 ·

CC 4.0 BY-SA版权

CSS 前端专栏收录该内容

2 篇文章

订阅专栏

clearfix清除浮动

在这里插入图片描述

	> <style type="text/css">
	.container{
		background: green;
		display: flex;
		width: 100%;
		justify-content: center;
	}
	.clearfix:after,
	.clearfix:before{
		content: '/20';
		display: block;
		height: 0px;
		clear: both;
		line-height: 0px;
		visibility: hidden;
	}
	/* 用在ie6  因为IE6不支持:after伪类，这个神奇的zoom:1让IE6的元素可以清除浮动来包裹内部元素。 */
	.clearfix{*zoom:1;}
	.left{
		 width: 200px;height: 200px;background: pink;text-align: center;
	}
</style>

以上代码可以清除浮动。
如果不清除浮动，container类的高度将是0，不能包裹住其内部元素。