1、

以div元素布局为例,div是块级元素,在页面中独占一行,自上而下排列,也就是传说中的流,是指标准流中的div.

无论多么复杂的布局,其基本出发点均是:“如何在一行显示多个div元素”,显然标准流已经无法满足需求,这就要用到浮动。

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

2、

假如某个div元素A是浮动的,如果A元素上一个元素也是浮动的,那么A元素会跟随在上一个元素的后边(如果一行放不下这两个元素,那么A元素会被挤到下一行);如果A元素上一个元素是标准流中的元素,那么A的相对垂直位置不会改变,也就是说A的顶部总是和上一个元素的底部对齐。

div的顺序是HTML代码中div的顺序决定的。
靠近页面边缘的一端是前,远离页面边缘的一端是后。

3、

清除浮动可以理解为打破横向排列。
对于CSS的清除浮动(clear),这个规则只能影响使用清除的元素本身,不能影响其他元素。

原文:http://www.dabaoku.com/jiaocheng/wangye/css/2013040918035.shtml

css浮动(float,clear)的更多相关文章

  1. 验分享:CSS浮动(float,clear)通俗讲解

    经验分享:CSS浮动(float,clear)通俗讲解 很早以前就接触过CSS,但对于浮动始终非常迷惑,可能是自身理解能力差,也可能是没能遇到一篇通俗的教程. 前些天小菜终于搞懂了浮动的基本原理,迫不 ...

  2. CSS浮动(float,clear)通俗讲解

    首先要知道,div是块级元素,在页面中独占一行,自上而下排列,也就是传说中的流.如下图: 可以看出,即使div1的宽度很小,页面中一行可以容下div1和div2,div2也不会排在div1后边,因为d ...

  3. 经验分享:CSS浮动(float,clear)通俗讲解

    很早以前就接触过CSS,但对于浮动始终非常迷惑,可能是自身理解能力差,也可能是没能遇到一篇通俗的教程. 前些天小菜终于搞懂了浮动的基本原理,迫不及待的分享给大家. 写在前面的话: 由于CSS内容比较多 ...

  4. 经验分享:CSS浮动(float,clear)通俗讲解(转载)

    很早以前就接触过CSS,但对于浮动始终非常迷惑,可能是自身理解能力差,也可能是没能遇到一篇通俗的教程. 前些天小菜终于搞懂了浮动的基本原理,迫不及待的分享给大家. 写在前面的话: 由于CSS内容比较多 ...

  5. 经验分享:CSS浮动(float,clear)通俗讲解 太棒了,清晰明了

    很早以前就接触过CSS,但对于浮动始终非常迷惑,可能是自身理解能力差,也可能是没能遇到一篇通俗的教程. 前些天小菜终于搞懂了浮动的基本原理,迫不及待的分享给大家. 写在前面的话: 由于CSS内容比较多 ...

  6. (转)经验分享:CSS浮动(float,clear)通俗讲解

    很早以前就接触过CSS,但对于浮动始终非常迷惑,可能是自身理解能力差,也可能是没能遇到一篇通俗的教程. 前些天小菜终于搞懂了浮动的基本原理,迫不及待的分享给大家. 写在前面的话: 由于CSS内容比较多 ...

  7. css浮动--float/clear通俗讲解(转载)

    本文为转载 (出处:http://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html) 教程开始: 首先要知道,div是块级元素,在页面 ...

  8. (转)经验分享:CSS浮动(float,clear)通俗讲解

    文章转自:https://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html 很早以前就接触过CSS,但对于浮动始终非常迷惑,可能是自身 ...

  9. 【转】CSS浮动(float,clear)通俗讲解

    作者:杨元 本文链接:http://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html 很早以前就接触过CSS,但对于浮动始终非常迷惑, ...

随机推荐

  1. PHP学习笔记-1——快捷键

    整行删除 ctrl+E set get 生成 alt+ insert 查找.搜索和替换 Ctrl-F3 搜索位于插入点的词 F3/Shift-F3 在文件中查找下一个/上一个 Ctrl-F/H 在文件 ...

  2. 基于LNMP的Zabbbix之PHP源码安装

    安装一些依赖的包 wget -c ftp://xmlsoft.org/libxml2/libxml2-2.7.8.tar.gz .tar.gz -C ../source/ cd ../source/l ...

  3. ubuntu 14.04 安装torch及编译环境zbstudio

    ubuntu 14.04 安装torch及编译环境zbstudio torch zbstudio 本来是安装官网给的步骤安装torch的,可是碰到一系列的问题,后来参考网上的安装方法安装成功了 官网安 ...

  4. BZOJ 1257 [CQOI2007]余数之和sum ——Dirichlet积

    [题目分析] 卷积很好玩啊. [代码] #include <cstdio> #include <cstring> #include <cmath> #include ...

  5. Nodejs的多线程

    转: http://snoopyxdy.blog.163.com/blog/static/60117440201349352443/

  6. C++中类的大小计算方法总结《网络+总结》

    C++中类的成员函数,静态成员是不占类的大小的.类的大小等于基类的大小+子类个non-static成员变量的大小再+非虚基类大小,如果有多态性还要考虑vptr(可能不止一个)大小,这里成员变量是会被字 ...

  7. JavaScript(一)---- 概述

    JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标 ...

  8. sql语句:CASE WHEN END 的用法

    select b,c, CASE a ' ' ' end from test1

  9. gec210 NAND BOOT与SD BOOT启动原理

    CPU上电后,此时SP指针指向0x0000_0000,从这个地址取第一条指令.但此时:PLL没有启动,CPU工作频率为外部输入晶振频率,非常低(S5PV210中晶振在CPU旁边,两颗24MHz,一颗2 ...

  10. PHP 一致性哈希算法的一种简单实现

    在分布式系统中,如果某业务可以由多个相同的节点处理,很容易想到用HASH的方式将业务请求分散到这些节点处理,比如memecache缓存等分 布式集群应用,如果只是简单的使用,不涉及用户用户状态等信息, ...