清除浮动float那点事儿

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

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

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

样式如下:

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

}

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

.clearfix{

zoom:1

}

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

简单的实例应用:

//sth

//sth

为什么要清除浮动:

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

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


本文题目:清除浮动float那点事儿
文章源于:https://www.cdcxhl.com/news/167202.html

成都网站建设公司_创新互联,为您提供品牌网站设计网站收录云服务器外贸网站建设建站公司App设计

广告

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

绵阳服务器托管