1、浮动的框可以向左或向右移动直到它的外边缘碰到包含框或另一个浮动框的边框为止。

脱离常规流,由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样。

2、几张图说明浮动常见现象:

差不多就这么多啦,现在知道文字环绕图片的原理了吗?倒数第二张图就是最好的说明,浮动的元素的脱离常规流,使后面的元素和自己重叠,但后面的元素的内容又会从浮动元素的左边开始!!!!!!这就是浮动元素的独特之处,也是和绝对定位(也是脱离常规流)很重要的一个不同之处。

(备注:float在绝对定位和display为none时不会被应用。 )

float虽然在绝对定位元素上是无效的,但可以和相对元素一起使用,效果相对于,先浮动,然后相对定位(所以浮动后的位置还会被占着的)

对css中的浮动属性float刨根解牛的更多相关文章

  1. 对css中的定位属性postion刨根解牛

    定位的基本思想很简单: 它允许你定义元素框相对于其正常位置应该出现的位置(relative),或者相对于父元素(absolute).另一个元素甚至浏览器窗口本身的位置(fixed).显然,这个功能非常 ...

  2. CSS基础之浮动属性float图文详解

      宏观地讲,我们的web页面的制作,是个“流”,必须从上而下,像“织毛衣”.   标准流里面的限制非常多,导致很多页面效果无法实现.如果我们现在就要并排.并且就要设置宽高,那该怎么办呢?办法是:超脱 ...

  3. 对CSS中的Position、Float属性的一些深入探讨

    对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个CSS属性,对于这两个属性的使用上面可能大多数人存在一些模糊与不 ...

  4. 装载:对CSS中的Position、Float属性的一些深入探讨

    对CSS中的Position.Float属性的一些深入探讨   对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个 ...

  5. 【Web】CSS中的浮动float

    CSS中的float 文章目录 CSS中的float 1.float浮动属性 2.float文字环绕图片 3.float浮动的真正原因以及副作用分析 4.清除浮动的四种解决方法 5.实际应用 导航效果 ...

  6. CSS中的浮动和定位

    在了解CSS中的浮动和定位之前有必要先了解清楚标准流和脱离标准流的特性 标准流的默认特性 1.分行.块级元素,并且能够dispay转换. 2.块级元素(block):默认独占一行,不能并列显示,能够设 ...

  7. 深入理解css中的margin属性

    深入理解css中的margin属性 之前我一直认为margin属性是一个非常简单的属性,但是最近做项目时遇到了一些问题,才发现margin属性还是有一些“坑”的,下面我会介绍margin的基本知识以及 ...

  8. css中的浮动以及清除浮动

    对于css中的浮动问题,曾经有一段时间我是懵懵懂懂的感觉,对于float这个属性一直是似懂非懂的赶脚,对于这种让我们一直懵懵懂懂的知识点,我们就需要找个时间点,仔仔细细的去将它搞懂,从这个过程中我们也 ...

  9. 如何理解CSS中的浮动 :其实他就像乘坐扶梯一样

    只要你用过自动扶梯,你就能很快的理解CSS中的浮动(Float). 你肯定遇到过这样的情况:       做好了,你想用CSS浮动来调整元素间的位置关系. 在写完代码之后,你发现浮动元素没出现在你设想 ...

随机推荐

  1. BZOJ 1738: [Usaco2005 mar]Ombrophobic Bovines 发抖的牛

    Description 约翰的牛们非常害怕淋雨,那会使他们瑟瑟发抖.他们打算安装一个下雨报警器,并且安排了一个撤退计划.他们需要计算最少的让所有牛进入雨棚的时间.    牛们在农场的F(1≤F≤200 ...

  2. POJ 2195 Going Home(最小费用最大流)

    http://poj.org/problem?id=2195 题意 :  N*M的点阵中,有N个人,N个房子.让x个人走到这x个房子中,只能上下左右走,每个人每走一步就花1美元,问当所有的人都归位了之 ...

  3. PYTHON多进程并发WEB服务器(利用LINUX的FORK)

    这个又牛X 一点点.. 这还不涉及IO,如果调用GEVENT之类作异步IO或非阻塞IO,那就大框架都有啦.. ############################################# ...

  4. easyui源码翻译1.32--DateBox(日期输入框)

    前言 扩展自$.fn.combo.defaults.使用$.fn.datebox.defaults重写默认值对象.下载该插件翻译源码 日期输入框结合了一个可编辑的文本框控件和允许用户选择日期的下拉日历 ...

  5. SQL Server中时间段查询和数据类型转换

    不知道什么时候对数据独有情种,也许是因为所学专业的缘故,也许是在多年的工作中的亲身经历,无数据,很多事情干不了,数据精度不够,也很多事情干不了,有一次跟一个朋友开玩笑说,如果在写论文的时候,能有一份独 ...

  6. Yorhom浅谈:作为一名初中生,自学编程的点点滴滴 - Yorhom's Game Box

    Yorhom浅谈:作为一名初中生,自学编程的点点滴滴 我是一名不折不扣的初中生,白天要背着书包去上学,晚上要拿起笔写作业.天天如此,年年如此. 我的爱好很广泛,喜欢了解历史,读侦探小说,骑车,打篮球, ...

  7. 【HDOJ】1297 Children’s Queue

    递推,最近发现自己做递推的题总是没有思路.下周多练习.对于f(n)可以在第n个位置为男生,此时共有f(n-1)种情况:若在第n个位置为女生,因此第n-1个位置也必须为女生.此时有两种情况,一种情况是在 ...

  8. URAL1244. Gentlemen(背包)

    链接 以前做的题 VJ太水了 数组里面的数可能会小于0 当时没判断 #include <iostream> #include<cstdio> #include<cstri ...

  9. hdu4323Magic Number(dp)

    http://acm.hdu.edu.cn/showproblem.php?pid=4323 去年的多校 编辑距离的变形 暴力居然过了 还想了好久别的方法,想得很头疼 #include <ios ...

  10. Mapreduce-Partition分析

    Partition所处的位置 Partition位置 Partition主要作用就是将map的结果发送到相应的reduce.这就对partition有两个要求: 1)均衡负载,尽量的将工作均匀的分配给 ...