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. (转)Android强制设置横屏或竖屏

    全屏 在Activity的onCreate方法中的setContentView(myview)调用之前添加下面代码 requestWindowFeature(Window.FEATURE_NO_TIT ...

  2. VMware网络模式介绍

    VMWare提供了三种工作模式,它们是bridged(桥接模式).NAT(网络地址转换模式)和host-only(主机模式). Bridged 模式: 在桥接模式下,VMware虚拟机里的系统就像是  ...

  3. laravel修改命名空间中的App为各自项目的名称(个人喜好)

    学习源头:https://blog.csdn.net/xx1129244705/article/details/77965618 laravel框架的应用默认命名空间是App,修改命名空间的可通过ap ...

  4. 在 Docker 中运行 MySQL

    首先启用 Windows 10 的容器功能,然后去 Docker 的官网,下载安装包. 跟着安装程序走完流程,Docker 就在 Windows 上愉快的游起来啦~ 设置镜像地址 Docker 在创建 ...

  5. mysql事务之二:MySQL隔离级别演示

    登录mysql: mysql -u root -p123456 Mysql 版本号 mysql> select version(); +-------------------------+ | ...

  6. jsp数据显示分页

    从数据库获得数据就不写了,直接写如何进行分页,为了方便,把方法和实体类都写到一个java文件里面了 这只是一种简单的分页方法,肯能会有比较多的bug 这是java里的构造实体类和方法, public ...

  7. mysql数据恢复 insert\update\delete 工具MyFlash

    一.简介MyFlash是由美团点评公司技术工程部开发维护的一个回滚DML操作的工具.该工具通过解析v4版本的binlog,完成回滚操作.相对已有的回滚工具,其增加了更多的过滤选项,让回滚更加容易. 该 ...

  8. Oracle10g客户端连接远程数据库配置图解

    yuanwen:http://blog.csdn.net/DKZhu/article/details/6027933 一.      安装oracle客户端 1. 运行setup.exe,出现 2. ...

  9. storm集群配置以及java编写拓扑例子

    storm集群配置 安装 修改配置文件 使用java编写拓扑 storm集群配置 storm配置相当简单 安装 tar -zxvf apache-storm-1.2.2.tar.gz rm apach ...

  10. oracle一个创建用户、创建表空间、授权、建表的完整过程

    1.首先我们可以用scott用户以sysdba的身份登录oracle. conn scott/tiger as sysdba 2.然后我就可以来创建用户了. create user zzg ident ...