1, 浮动框(float)会使得元素脱离文档流, 因此不占用文档空间; 因此当一个Div的子元素都为float时会导致该Div高度为0, 这一问题称为"高度塌陷"

为了解决这个问题我们可以在该Div后面添加一个样式

#main:AFTER {

    display: block;

    clear: both;

    content: "";

    visibility: hidden;

    height: 0

}

参见 伪元素:AFTER

测试

CSS备忘录的更多相关文章

  1. css备忘录（关于relative、absolute）

    父级用:position: relative; 子级才能用:position: absolute; relative里面用margin调位置: absolute里面用top.left.right.bo ...

  2. css百叶窗

    效果图: css代码块: <style> *{//默认样式清除 margin: 0; padding: 0; } .content{//设置外层div的宽高,超出后隐藏 margin: 1 ...

  3. Matplotlib数据可视化（3）：文本与轴

      在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像 ...

  4. CSS选择器备忘录

    CSS选择器备忘录 基本选择器 Selector Meaning Example 通用选择器 匹配任何元素 * 标签选择器 CSS1中称之为元素选择器,匹配为指定标签的所有元素 div 伪元素选择器 ...

  5. Bootstrap.css 中请求googleapis.com/css?family 备忘录

    问题描述: Web中引入bootstrap.css中头部有访问Google服务器的请求 @import url("//fonts.googleapis.com/css?family=Open ...

  6. css+div常用属性备忘录

    学习软件设计有一年多了,明年五月就要毕业了.回头看看发现自己其实挺差劲的. 最近开通了博客所以就整理了一下笔记,在这里发布一下自己以前学习css时总是记不住去翻书又很常用的属性,都是一些很基础的. 大 ...

  7. css，html备忘录

    1.background:url()#000 ;代表当图片不够充满容器时,用黑色填满. 2.height:inherit;继承父级元素的高度. 当子元素给了绝对定位,父元素不给相对定位,子元素也能适配 ...

  8. css小贴士备忘录

    前言:在CSS的学习实践过程中,我经常遗忘一些貌似常用的代码,为了能够强化记忆特在此作归纳整理并将陆续增删,以备即时查阅.但愿今后能遇到问题及时解决,牢牢记住这些奇怪的字符们. 一.关于段落文本强制对 ...

  9. CSS HTML 常用属性备忘录

    学习软件设计有一年多了,明年五月就要毕业了.回头看看发现自己其实挺差劲的. 最近开通了博客所以就整理了一下笔记,在这里发布一下自己以前学习css时总是记不住去翻书又很常用的属性,都是一些很基础的. 大 ...

随机推荐

  1. IOS 页面间跳转

    常用的就两种 一种通过导航,一种直接跳 第一种 直接跳转 思路大致就是new一个目的页面,然后设置下页面跳转动画 中间还可以做点目的页面的数据初始化: ValueInputView *valueVie ...

  2. IOS开发基础知识--碎片13

    1:运行程序报the file couldn't be opened because you don't have permission to view it 解决办法:项目—>targets- ...

  3. svn报错：“Previous operation has not finished; run 'cleanup' if it was interrupted“ 的解决方法

    今天改完代码提交时,提交接近完成但窗口还未关闭电脑蓝屏了.夏天来了,电脑比人还怕热啊~~~   心里咯噔一下,估计svn又会出一些莫名其妙的问题了. 果然,待电脑重启后开eclipse,文件还是新增状 ...

  4. 专用服务器模式&共享服务器模式

    连接ORACLE服务器一般有两种方式:专用服务器连接(dedicated server)和共享服务器连接(shared server).那么两者有啥区别和不同呢?下面我们将对这两者的区别与不同一一剖析 ...

  5. Asp.Net MVC+BootStrap+EF6.0实现简单的用户角色权限管理9

    前两天因有事就没来得及写.今天刚刚好空了.这次写的是对角色和管理员对页面按钮之间的控制.先看页面效果 说明:先根据角色设置好角色的权限,然后管理员在对应的角色下的权限去设置其权限. 在设置角色权限的时 ...

  6. Mac OS X常用操作入门指南

    前两天入手一个Macbook air,在装软件过程中摸索了一些基本操作,现就常用操作进行总结, 1关于触控板: 按下(不区分左右)            ＝鼠标左键 control+按下        ...

  7. android开发之onCreate( )方法详解

    这里我们只关注一句话:This is where you should do all of your normal static set up.其中我们只关注normal static,normal: ...

  8. 发现 OpenStack: 架构、功能和交互

    原文:http://www.ibm.com/developerworks/cn/cloud/library/cl-openstack-overview/index.html OpenStack 是由 ...

  9. NOIP模拟赛20161016R1

    1.传教士(bishop) 问题描述: panzhili王国的疆土恰好是一个矩形,为了管理方便,国王jjs将整个疆土划分成N*M块大小相同的区域.由于jjs希望他的子民也能信教爱教(”打拳”神教),所 ...

  10. HTML 学习笔记 JavaScript（创建对象）

    原博地址:http://www.cnblogs.com/dolphinX/p/3288118.html JavaScript 有Date Array String等这样的内置对象,功能强大实用简单,但 ...