清除浮动float那点事儿

2022-06-14    分类： 网站建设

抛弃那些没用的方法，只记住最实用的一种方法即可！

给要清除浮动的父元素多加一个class属性：clearfix！！！

样式如下：

.clearfix:after{
     content:".";
     display:block;
     height:0;
     clear:both;
     visibility:hidden;    

}

为了兼容ie6,ie7（现在的项目几乎已经完全不考虑）

.clearfix{

zoom:1

}

清除浮动就是这么简单，可以作为公共样式common.css，每个页面都可以直接调用！

简单的实例应用：

<div class="clearfix">

<div >

//sth

</div>

<div >

//sth

</div>

</div>

为什么要清除浮动：

1.之前写的时候都会发现页面写着写着就发生错乱，而且还有重叠？就是浮动惹的祸！

2.父级元素下面的子元素float时，可能会导致父级height值为0；故在使用了float之后，
立即在父级上面加上clearfix，彻底消除float带来的各种怪异问题！


文章名称：清除浮动float那点事儿
URL网址：https://www.cdcxhl.com/news2/167202.html

成都网站建设公司_创新互联，为您提供静态网站、小程序开发、虚拟主机、移动网站建设、营销型网站建设、微信小程序

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联

猜你还喜欢下面的内容

网站建设网站维护公司

网站建设知识

分类信息网