1 定义:CSS 的 Float(浮动),会使元素向左或向右移动,其周围的元素也会重新排列。

2 解释:浮动的元素,浮在界面上,脱离了HTML文本流。

  元素的水平方向浮动,意味着元素只能左右移动而不能上下移动。

  一个浮动元素会尽量向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。

  浮动元素之后的元素将围绕它。

  浮动元素之前的元素将不会受到影响。

  如果图像是右浮动,下面的文本流将环绕在它左边:

  img { float:right; }

  float:属性

  left
  right
  none
  inherit

3 彼此相邻的浮动元素:

如果你把几个浮动的元素放到一起,如果有空间的话,它们将彼此相邻。

css总结12:CSS Float(浮动)的更多相关文章

  1. CSS| position定位和float浮动

    对基础知识再度做个巩固和梳理. 一.position定位 (一):position的属性 1.absolute:生成绝对定位的元素,相对于最近一级定位不是static的父元素来进行定位: 2.rela ...

  2. css案例学习之float浮动

    代码: <!DOCTYPE html PUBliC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. ...

  3. float浮动深入理解

    [CSS深入理解之float浮动]听课总结 (http://www.imooc.com/learn/121)   1.float的原本作用:为了实现文字环绕 2.float的包裹性和破坏性: 包裹性: ...

  4. 清除float浮动造成影响的几种解决方案

    1. “清除浮动” ??准确的描述应该是“清除浮动造成的影响”  学习浮动推荐的视频教程<CSS深入理解之float浮动> 2.如何清除浮动造成的影响??? 栗子 块级div元素包含一个内 ...

  5. css之float(浮动)的特性

    详解CSS float属性  float本身不脱离文档流,但是和 position:absolute;搭配使用会脱离文档流 阅读目录 基础知识 float的详细细节 float特殊情况 clear属性 ...

  6. 【转】CSS清除浮动_清除float浮动

    CSS清除浮动方法集合 一.浮动产生原因 一般浮动是什么情况呢?一般是一个盒子里使用了CSS float浮动属性,导致父级对象盒子不能被撑开,这样CSS float浮动就产生了. 浮动产生样式效果截图 ...

  7. 对css float 浮动的学习心得

    css float浮动详解 @(css float)[hasLayout|clear float|妙瞳] css float的定义和用法 float 属性定义元素在哪个方向浮动.以往这个属性总应用于图 ...

  8. [转] CSS float 浮动属性

    http://www.cnblogs.com/polk6/p/3142187.html CSS float 浮动属性 本篇主要介绍float属性:定义元素朝哪个方向浮动. 目录: 1. 页面布局方式: ...

  9. CSS清除浮动_清除float浮动

    2.clear:both清除浮动为了统一样式,我们新建一个样式选择器CSS命名为“.clear”,并且对应选择器样式为“clear:both”,然后我们在父级“</div>”结束前加此di ...

  10. 归纳篇(一)CSS的position定位和float浮动

    近期会更新一系列博客,对基础知识再度做个巩固和梳理. 一.position定位 (一):position的属性 1.absolute:生成绝对定位的元素,相对于最近一级定位不是static的父元素来进 ...

随机推荐

  1. Ajax异步调用http接口后刷新页面

    使用Ajax的目的就是提高页面响应速度,无需同步调用,无需整个页面刷新.这里直接在html中使用js来实现: 先获取XMLHttpRequest对象 var xmlHttp; //创建一个xmlHtt ...

  2. mysql各种集群的优缺点

    mysql各种集群的优缺点 1.主从架构:只是有数据备份的功能: 2.主主互备+keepalived:实现数据备份加高可用: 3.主主互备,主主下面分别挂个从: 4.A和B主主互备,把从库都挂到B下, ...

  3. (转)Makefile经典教程(掌握这些足够)

    该篇文章为转载,是对原作者系列文章的总汇加上标注. 支持原创,请移步陈浩大神博客: http://blog.csdn.net/haoel/article/details/2886 makefile很重 ...

  4. AppCan上下拉列表刷新

    function initBounce(funcTop, funcBottom){ uexWindow.setBounce("1"); if (!funcTop && ...

  5. 【转】Jmeter 代理服务器录制脚本

    因为Badboy只支持IE浏览器,现在又不得不到到fireFox上录制脚本才能完成,再次重温下Jmeter自带的Http代理服务器,当然比起badboy,它稍稍麻烦点. 1  配置很简单 工作台--& ...

  6. php 语句块耗时性能测试

    $t= microtime(true);        .............................        echo microtime(true) - $t; 1查看从入口文件 ...

  7. Py修行路 python基础 (十)装饰器

    装饰器 一.定义 装饰器:顾名思义,就是对某个东西起到装饰修饰的功能. python中的装饰器,其本质上就是一个python函数,它可以让其他函数在不需要任何代码变动的前提下增加额外功能.通俗理解就是 ...

  8. Py修行路 python基础 (十一)迭代器 与 生成器

    一.什么是迭代? 迭代通俗的讲就是一个遍历重复的过程. 维基百科中 迭代(Iteration) 的一个通用概念是:重复某个过程的行为,这个过程中的每次重复称为一次迭代.具体对应到Python编程中就是 ...

  9. http协议请求响应内容示例

    POST http://www.cytxl.com.cn/api/common/login.php?XDEBUG_SESSION_START=netbeans-xdebug HTTP/1.1 Host ...

  10. Canopy聚类算法

    Canopy聚类算法(经典,看图就明白) 聚类算法. 这个算法获得的并不是最终结果,它是为其他算法服务的,比如k-means算法.它能有效地降低k-means算法中计算点之间距离的复杂度. 图中有一个 ...