float:left;(左浮动)他使得指定元素脱离普通的文档流而产生的特别的布局特性。并且FLOAT必需应用在块级元素之上，也就是说浮动并不应用于内联标签。或者换句话来说当应用了FLOAT那么这个元素将被指定为块级元素。

float：浮动；left：左；就是往左浮动。用来布局，差不多就是底下的一块上来的话，往左靠。

比如A和B同行float:left了,这时候有个C不想float:left 和AB同一行, 
就可以给C来个clear:left,这样C就可以在另一行了

左浮动，靠左显示

clear:both;在css中，首先我们理解一下clear，顾名思义就是清除的意思，both的意思是全部，那连起来就是清除全部样式，不过这个样式主要是用于对多个div浮动的清除，如float:left,如果不清除，很容易对下面的div造成显示错位

css 中 的 float :left 和 clear :both的更多相关文章

  1. 关于CSS中的float可能出现的小问题

    关于CSS中的float可能出现的小问题 前言:最近学习CSS的float所遇到点小问题,然后顺便分享给大家. 一.什么是CSS以及float (一) CSS概述 CSS是层叠样式表(英文全称:Cas ...

  2. 文档流 css中的float clear与布局

    文档流 先说说什么是文档流  流是什么 就是一串连续的东西 <div style="background-color:pink;width:40px;height:80px;" ...

  3. 如何理解css中的float

    最近一段时间一直在为一个即将上线的新站进行一些前端开发.自然,对CSS的使用是必不可少的了.我们在CSS 中很多时候会用到浮动来布局.常见的有 float:left 或者 float:right .简 ...

  4. css中的float属性以及清除方法 (2011-09-03 17:36:26)

    CSS里面的浮动属性是布局的常用工具,只有真正了解它并熟练使用才能将它的优点发挥到极致. 许多页面中都有文字绕图效果,并且各区块分布得错落有置,很多朋友在自学CSS布局时为了做出这些效果往往会被div ...

  5. CSS学习系列4 -- 再说CSS中的浮动运用及clear:left/right实际用法

    在 CSS学习系列2 -- CSS中的清除浮动 中,我们详细说了CSS中清除浮动的方法及使用 后来我自己在项目开发一个需要使用浮动的网页时,进行了实际运用,加上后来看到一篇好文章.所以就在这里再次写篇 ...

  6. CSS中的float与clear

    参考: http://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html http://www.cnblogs.com/iloveyou ...

  7. [转][译]关于CSS中的float和position和z-index

    原文:http://learn.shayhowe.com/advanced-html-css/detailed-css-positioning 当构建页面排版时,有不同的方法可以使用.使用哪一种方法取 ...

  8. CSS中正确理解浮动以及clear:both的关系

    要注意以下几点: 1. 浮动元素会被自动设置成块级元素,相当于给元素设置了display:block(块级元素能设置宽和高,而行内元素则不可以). 2. 浮动元素后边的非浮动元素显示问题. 3. 多个 ...

  9. [译] 关于CSS中的float和position

    原文 http://learn.shayhowe.com/advanced-html-css/detailed-css-positioning 当构建页面排版时,有不同的方法可以使用.使用哪一种方法取 ...

随机推荐

  1. HP P2055d激光打印机PCL XL error的解决

    近日,于客户处安装HP P2055d激光打印机(2009年11月份生产的机器),介绍下硬件环境:PC:Dell OptiPlex 360,另有一台富士通DPK 8600E票据打印机,P2055d通过U ...

  2. android 08 AndroidManifest.xml

    AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xm ...

  3. mysqldump备份数据库时出现when using LOCK TABLES

    用mysqldump备份数据库时,如果出现when using LOCK TABLES,解决办法是加上 --skip-lock-tables 例如: 用mysqldump备份数据库时出现 29: Fi ...

  4. Java基础知识强化之集合框架笔记41：Set集合之HashSet存储自定义对象并遍历练习

    1. HashSet集合存储自定义对象并遍历.如果对象的成员变量值相同即为同一个对象 注意了: 你使用的是HashSet集合,这个集合的底层是哈希表结构. 而哈希表结构底层依赖:hashCode()和 ...

  5. iOS的内存管理

    在Objective-C 这种面向对象的语言里,内存管理是个重要的概念.要想用一门语言写出内存使用效率高而且又没有bug的代码,就得掌握其内存管理模型的种种细节. 一旦理解了这些规则,你就会发现,其实 ...

  6. Winform 程序中dll程序集嵌入exe可执行文件

    关于这方面,Google一下有很多方法,参考: http://blog.csdn.net/astonqa/article/details/7300856 但按照以上的方法我并没有成功,于是继续找到了一 ...

  7. 委托、 Lambda表达式和事件——事件

    /* * 由SharpDevelop创建. * 用户: David Huang * 日期: 2015/7/31 * 时间: 14:21 */ using System; namespace 事件 { ...

  8. Java-Hibernate官方英文文档地址

    Hibernate官方英文文档地址  http://docs.jboss.org/hibernate/orm/4.3/manual/en-US/html/

  9. DataReader反射泛型对象

    昨天听同学说,要把DataReader对象转成实体对象,要写一个通用的方法.想了下用反射应该可以做到.项目中一般都是用第三方组件来做数据访问层,如,Nhibernate.ef等.于是自己想写个简单例子 ...

  10. Html5 部分特性

    HTML5 是 W3C 与 WHATWG 合作的结果. 编者注:W3C 指 World Wide Web Consortium,万维网联盟. 编者注:WHATWG 指 Web Hypertext Ap ...