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. Oracle cursor_sharing 参数 详解

    一. 官网的说明 http://download.oracle.com/docs/cd/E11882_01/server.112/e17110/initparams042.htm#REFRN10025 ...

  2. Jvm垃圾回收器详细

    1, 串行回收器 1.1, 新生代串行回收器 (1)特点:  –它仅仅使用单线程进行垃圾回收  –它是独占式的垃圾回收  –进行垃圾回收时, Java应用程序中的线程都需要暂停(Stop-The-Wo ...

  3. 项目中使用的图片上传方法,base64存本地

    //生成健康报告 public function uploadJkbg(Request $r) { $data = $r->all(); $jkbg['jkbg_ctime'] = time() ...

  4. win7 安装过程中遇到的错误解决方法

    win7 安装过程中遇到的错误解决方法 windows安装无法继续.若要安装windows 请单击 确定 重新启动计算机: 当 出现如上提示的时候,按下shift+f10 会打开命令窗口,进入到C:\ ...

  5. .Net上传文件超过了最大请求长度

    错误消息:超过了最大请求长度    错误原因:asp.net默认最大上传文件大小为4M,运行超时时间为90S. 修改web.config文件可以改变这个默认值为 <configuration&g ...

  6. 分布式缓存系统 Memcached 内存管理机制

    在前面slab数据存储部分分析了Memecached中记录数据的具体存储机制,从中可以看到所采用的内存管理机制——slab内存管理,这也正是linux所采用的内存高效管理机制,对于Memchached ...

  7. 乘积最大(线性dp)

    乘积最大 时间限制: 1 Sec  内存限制: 128 MB提交: 4  解决: 4[提交][状态][讨论版][命题人:quanxing] 题目描述 今年是国际数学联盟确定的“2000——世界数学年” ...

  8. git版本控制-详细操作

    - git,软件帮助使用者进行版本的管理 阶段一git 命令: git init 初始化 git config --global user.email "you@example.com&qu ...

  9. jQuery UI Draggable + Sortable 结合使用

    工作中需要将一个左边的设计好的控件,拖拽到右边的面板中,同时保持右边面板中的控件自由排序,这时候就需要及支持拖拽又支持排序的操作了, Demo截图:从左边控件拖到右边区域 代码段: <scrip ...

  10. win7系统程序未响应怎么办

    问题描述:出现“程序未响应...”而后系统程序就没有反应了. 解决方案:1.运行→输入“regedit”→hkey_current_usser/control panel/desktop/window ...