问题：在练习过程中，发现div1浮动后，它下面的div被覆盖住了。

解决方案：清除该div1的浮动。

关于CSS的浮动

1.div是块级元素，独占一行

2.浮动可以理解为让某个div元素脱离标准流，漂浮在标准流之上，和标准流不是一个层次

3.让两个div并排放，给两个div都加上float，但是如果两个div的宽度超过上级宽度时，也会是在两行显示的。

4.清除浮动可以理解为打破横向排列，关键词是clear。语法：clear：none|left|right|both

相关资料：http://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html

CSS的浮动（float）的更多相关文章

  1. css清除浮动float

    css清除浮动float 1.分析HTML代码 <div class="outer"> <div class="div1">1</ ...

  2. 【转】css清除浮动float的三种方法总结，为什么清浮动？浮动会有那些影响？

    摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?     一.抛一块问题砖(display: block)先看现象: 分析HTML代码结构: <div class ...

  3. css清除浮动float的几种方法

    摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?     一.抛一块问题砖(display: block)先看现象: 这里我没有给最外层的DIV.outer 设置高度, ...

  4. css清除浮动float方法

    转载:http://www.cnblogs.com/ForEvErNoME/p/3383539.html 什么是CSS清除浮动? 在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的 ...

  5. css 关于浮动float的使用以及清除浮动

    float:none | left | right 默认值:none 适用于:所有元素 none:设置对象不浮动left:设置对象浮在左边right:设置对象浮在右边 当该属性不等于none引起对象浮 ...

  6. CSS清除浮动float方法总结

    使用浮动造成的BUG: 使用浮动前:(子节点是将父节点撑开了) 代码如下 <div class="box"> <div class="d1"& ...

  7. css清除浮动float的三种方法总结，为什么清浮动？浮动会有那些影响？一起来$('.float')

    一.抛一块问题砖(display: block)先看现象: 分析HTML代码结构: <div class="outer">     <div class=&quo ...

  8. css清除浮动float的三种方法总结

    原文地址: http://my.oschina.net/leipeng/blog/221125 张大神的解析: http://www.zhangxinxu.com/wordpress/2010/01/ ...

  9. CSS.04 -- 浮动float、overflow、定位position、CSS初始化

    标准流:行内/行内块元素横向有序排列 : 块元素纵向有序排列. 浮动:Float 语法:float:left/right :  设置浮动的元素,脱离标准流 浮动的框可以向左或向右移动,直到它的外边缘碰 ...

  10. 前端学习笔记之css清除浮动float的七种常用方法总结和兼容性处理

    在清除浮动前我们要了解两个重要的定义: 浮动的定义:使元素脱离文档流,按照指定方向发生移动,遇到父级边界或者相邻的浮动元素停了下来. 高度塌陷:浮动元素父元素高度自适应(父元素不写高度时,子元素写了浮 ...

随机推荐

  1. bzoj2656 数列

    Description 小白和小蓝在一起上数学课,下课后老师留了一道作业,求下面这个数列的通项公式: A[0]=0 A[1]=1 A[2n]=A[n] A[2n+1]=A[n]+A[n+1] 小白作为 ...

  2. Valgrind使用指南和错误分析

    Valgrind使用指南和错误分析 Valgrind是一个GPL的软件,用于Linux(For x86, amd64 and ppc32)程序的内存调试和代码剖析.你可以在它的环境中运行你的程序来监视 ...

  3. Nginx的ip_hash指令

    ip_hash 语法:ip_hash 默认值:none 使用环境:upstream 当对后端的多台动态应用服务器做负载均衡时,ip_hash指令能够将某个客户端IP的请求通过哈希算法定位到同一台后端服 ...

  4. ExtJS模版技术

    学习ExtJS一段时间以后,大家基本都会对于一些显示数据的组件不太符合需求,可能自己需要的组件在ExtJS里面不存在,这是大家基本就会使用Html属性,直接使用Html进行绘制页面数据展现. 但是,使 ...

  5. sorted()&enumerate()

    d = {1:2,3:1,44:5,4:5,7:8}l = d.items() #转换为列表print(l)  # dict_items([(1, 2), (3, 1), (44, 5), (4, 5 ...

  6. Select算法（最坏复杂度O(n)）

    #include<iostream> #include <stdio.h> #include <stdlib.h> #include <algorithm&g ...

  7. Django中组合搜索功能

    需求分析 很多电商网站中有组合搜索的功能,所谓组合搜索就是网页中组合多个条件,对数据库中进行查询,并且将结果显示在页面中,看个例子吧: 注意红框中的标识,我们可以根据URL来做组合搜索. video- ...

  8. 异常处理的设计与重构 pdf

    百度网盘: https://pan.baidu.com/s/1hsQIEGk

  9. linux更换shell外壳zsh

    linux-外壳内核与shell的关系 内核处于外壳之中,通过外壳与shell(命令行)交互 外壳可以更换 ############################################## ...

  10. UVA-568-数论

    题意 输入一个n,求n!最后一个不是0的数 2x5肯定是等于10的,先把所有不是2和5的数乘起来,保留最后一位 计算过程中计算出2和5的个数 因为2*5=10,而且2的个数比5的个数多,所以最后只要把 ...