浮动以后父DIV包不住子DIV解决方案
2024-08-26 04:46:49
转载自http://blog.sina.com.cn/s/blog_6c363acf0100v4cz.html
当DIV1里面嵌套有一个DIV2,当DIV2设置了浮动,那么DIV1是无法被撑开的,也就是说DIV2在这里相当于浮在了页面上方,跟DIV1不在同一个层面,导致了DIV2无法把DIV1给撑开,这是一个老生常谈的问题,也是困扰很多刚接触DIV+CSS的朋友的一个问题。
先来看看这个问题的实际效果
这里本来DIV1是套在了DIV2的外面的,如果是使用表格做的话,那么DIV1肯定被撑开了,效果应该是如下所示
那如何解决这个浮动了之后无法把容器撑开的局面呢?解决的方法这里介绍2仲。
第一种:在浮动结束的容器后面加上这段代码
<div style=”clear:both;”></div>
意思是清除浮动。
第二种:在外层DIV,也就是这里的DIV1的CSS里面加入以下CSS代码
overflow: auto;
这2种方法都可以实现DIV2把DIV1撑开。不过这里建议大家使用第一种方法,要养成一个习惯,在浮动应用完后消除浮动,这样后面的DIV就不会继承这个浮动(就像在编程的时候,在打开数据库,操作完后,要养成个习惯在后面把数据库关闭)。也就是说浮动这个东西会被继承,除非消除这个浮动,才不会让后面接着的DIV受到继承。其实不仅是DIV,其他的像P等其他的容器都会有继承的效应,大家要养成一个习惯记得要消除浮动。
最新文章
- 视频软件TurboDemo 教程:如何为视频添加旁白和音乐
- Hbase的flush机制
- android app设计内容
- JMeter中的关联-正则表达式提取(2)
- 在主方法中定义一个大小为50的一维整型数组,数组i名为x,数组中存放着{1,3,5,…,99}输出这个数组中的所有元素,每输出十个换一行
- 如何选择Html.RenderPartial和Html.RenderAction
- Linux多线程编程阅读链接
- 七中滤波方法测试matlab实现
- OS.ENVIRON()详解
- Python之路【第十七篇】:Django【进阶篇】
- 『重构--改善既有代码的设计』读书笔记----Replace Method with Method Object
- CreateFile FileSeek FileRead 直接读取数据
- 在MVC中利用uploadify插件实现上传文件的功能
- [Android学习笔记]继承自ViewGroup的控件的过程学习
- 模拟DbUtils实现接口回调机制
- java操作git简单实现
- How to emulate a Raspberry Pi on your PC
- Ubuntu-18.04安装Docker
- VMware中某个虚拟机卡死,单独关闭某个虚拟机的办法
- 翻译1-在SQL Server 2016中介绍微软R服务