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. 【设计模式 - 12】之代理模式(Proxy)

    1      模式简介 1.1    定义 为其他对象提供一种代理以控制对这个对象的访问.代理对象起到中介作用,可以去掉功能服务或增加额外服务. 1.2    常见的代理模式 1)        远程 ...

  2. android 35 ListView增删改差

    MainActivity package com.sxt.day05_11; import java.util.ArrayList; import java.util.List; import and ...

  3. 每日一linux命令 du [系列]

    http://www.cnblogs.com/peida/archive/2012/12/10/2810755.html   Linux du命令也是查看使用空间的,但是与df命令不同的是Linux  ...

  4. objective-c IBOutletCollection介绍

    objective-c IBOutletCollection介绍 将UI控件和源码进行链接时,方法的表示方法是IBAction,控件属性对象是IBOutlet.如果想将一个同类型的UI控件作为一个组放 ...

  5. [转] Creating a Simple RESTful Web App with Node.js, Express, and MongoDB

    You can find/fork the sample project on GitHub Hey! This and all my other tutorials will soon be mov ...

  6. c#中jeson字符串和OBJECT对象的相互转换

    对于本问题   我用三步来分别说明实现过程 1.定义一个类---- 实现转换的具体方法 using System; using System.Collections.Generic; using Sy ...

  7. Android推送技术研究

    前言 最近研究Android推送的实现, 研究了两天一夜, 有了一点收获, 写下来既为了分享, 也为了吐槽. 需要说明的是有些东西偏底层硬件和通信行业, 我对这些一窍不通, 只能说说自己的理解. 为什 ...

  8. Python 记录(一)

    一开始没发现3.5与2.x版本的区别,导致浪费了很多时间在导包等问题上: 如: Pyhton2中的urllib2工具包,在Python3中分拆成了urllib.request和urllib.error ...

  9. 利用DIV,实现简单的网页布局

    <html lang="en"><head> <meta charset="UTF-8"> <title>GIS ...

  10. HTML - 键盘事件

    Keyboard 事件 onkeydown: 在用户按下按键时触发. onkeypress: 在用户敲击按钮时触发. onkeyup: 当用户释放按键时触发. 示例 <!DOCTYPE html ...