博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
清楚float浮动的四种方法
阅读量:4922 次
发布时间:2019-06-11

本文共 753 字,大约阅读时间需要 2 分钟。

1、对父级设置适合CSS高度

对父级设置适合高度样式清除浮动,这里对“.divcss5”设置一定高度即可,一般设置高度需要能确定内容高度才能设置。

2、clear:both清除浮动
为了统一样式,我们新建一个样式选择器CSS命名为“.clear”,并且对应选择器样式为“clear:both”,然后我们在父级“</div>”结束前加此div引入“class="clear"”样式。这样即可清除浮动。
3、父级div定义 overflow:hidden
对父级CSS选择器加overflow:hidden样式,可以清除父级内使用float产生浮动。优点是可以很少CSS代码即可解决浮动产生。
为什么加入overflow:hidden即可清除浮动呢?
那是因为overflow:hidden属性相当于是让父级紧贴内容,这样即可紧贴其对象内内容(包括使用float的div盒子),从而实现了清除浮动。Css overflow:hidden清除浮动方法DIVCSS5推荐使用。
4.在父元素使用.clearfix()
.clearfix() {
*zoom: 1; &:before, &:after { content: " "; // 1 display: table; // 2 // Fixes Opera/contenteditable bug: // http://nicolasgallagher.com/micro-clearfix-hack/#comment-36952 line-height: 0; clear: both; }}

 

转载于:https://www.cnblogs.com/hanxuming/p/6186570.html

你可能感兴趣的文章
拉近距离(洛谷_2136)——判断负环
查看>>
ajax请求返回null
查看>>
curl实现GET、POST请求
查看>>
实验二
查看>>
c++ c# java 调用 c++ 写的dll
查看>>
css经典布局—stick footer布局
查看>>
div学习之div中dl-dt-dd的详解
查看>>
当在hive中show&nbsp;table&nbsp;…
查看>>
随机森林(Random Forest)
查看>>
[转载]/etc/security/limits.conf解释及应用
查看>>
Python的math模块
查看>>
Linux下gcc相关
查看>>
iphone真机(越狱)通讯录导入进模拟器
查看>>
剑指offer-删除链表中重复的结点
查看>>
mybatis自动生成mapper,dao映射文件
查看>>
IntelliJ IDEA 注册码
查看>>
C 调用数学函数pow时遇到 undefined reference [已解决]
查看>>
IDEA01 创建java项目、创建web项目
查看>>
Springboot21 整合redis、利用redis实现消息队列
查看>>
AJAX 总结
查看>>