1.假设现在CSS中没有浮动(float)属性,那么会变成一个什么样子。我们会发现,目前流行采用浮动方法实现的无论是分栏布局,还是列表排列我们都可以用其他一些CSS属性(不考虑table)代替实现,唯一一个实现不了的就是“文字环绕图片”,我是想不出来能有什么方法可以让文字环绕图片显示。好,这个替代不了的作用才是float真正的意义所在,即float属性最初被设计的时候就是用来完成文字环绕效果的。

2.运用了float的元素只能横向浮动,不能纵向浮动。当元素运用的浮动属性后,将会脱离普通文档流,起容器(父元素)讲得不到脱离普通文档流的子元素的高度。

3.对元素应用的浮动属性后,会更改元素的display属性,即将元素变为block,此时可对该元素按块模型进行处理。

4.浮动元素的后一个元素会围绕着浮动元素,典型运用是文字围绕图片,与应用的position的元素相比,浮动元素并不会遮盖后面元素。

5.浮动元素之前的元素不会受当前浮动元素的影响,,如果你想让两个块状元素并排显示,必须要让两个块状元素都应用float属性。

文章来源:艾维艾科技

CSS浮动特性总结的更多相关文章

  1. CSS浮动特性

    float:left/right左浮动有浮动 特点: ①浮动不占位:浮动元素不占位置 ②默认排列成一行,遇到边界自动换行 ③如果有文字(没有设置浮动的元素内容)会绕着浮动元素走 <!DOCTYP ...

  2. css浮动(folat),清除浮动(clear)(另加两种清除浮动方式,总共三种清除浮动方式)

    css浮动(float) float是css样式,用于设置标签的居左浮动和居右浮动,浮动后的元素不属于html文档流,需要用清除浮动把文档拽回到文档流中 浮动值: left:向左浮动 right:向右 ...

  3. css浮动(float)及清除浮动的几种实用方法

    CSS浮动是现在网页布局中使用最频繁的效果之一,而浮动可以帮我们解决很多问题,那么就让我们一起来看一看如何使用浮动. 一.css浮动(float) (1)html文档流 自窗体自上而下分成一行一行,并 ...

  4. Css - 浮动布局

    Css - 浮动布局 浮动布局 float 取值:left | right | none 利用float属性可设置元素的浮动,虽然浮动主要是应用于块元素,但行内元素其实也可以浮动,但行内元素本来就是一 ...

  5. CSS 浮动和清除

    CSS 浮动和清除浮动 在写页面布局的过程中,浮动是大家经常用的属性.在好多的排版布局中都是用的的浮动比如说下面这些地方都是应用到了浮动. 在我学习浮动的时候可是熬坏了脑筋,在这里我分享一下我对浮动这 ...

  6. css浮动(float)及如何清除浮动

    前言: CSS浮动是现在网页布局中使用最频繁的效果之一,而浮动可以帮我们解决很多问题,那么就让我们一起来看一看如何使用浮动. 一.css浮动(float)(1)html文档流 自窗体自上而下分成一行一 ...

  7. [CSS]CSS浮动塌陷及解决办法

    一. CSS浮动 先看一个例子 <html !DOCTYPE> <head> <title>HTML2</title> <style> .d ...

  8. css浮动现象及清除浮动的方法

    css浮动现象及清除浮动的方法   首先先明确浮动最初的定义及使用场景:实现文本环绕图片的效果. 除了用浮动外,目前暂无其他方法实现文本环绕   再来看看浮动的具体定义: 浮动的框可以左右移动,直至它 ...

  9. 18 12 28 css 浮动 定位

    浮动 浮动特性 1.浮动元素有左浮动(float:left)和右浮动(float:right)两种 2.浮动的元素会向左或向右浮动,碰到父元素边界.其他元素才停下来 3.相邻浮动的块元素可以并在一行, ...

随机推荐

  1. Android下得到已安装Application信息

    在上一篇blog中,谈到如何利用APK archive文件得到相应信息.(当时发现例如ProcessName,DataDir等信息,其实是无法得到的). 当前咱们看看如何通过系统取得已经安装的Appl ...

  2. Fixflow引擎解析(四)(模型) - 通过EMF扩展BPMN2.0元素

    Fixflow引擎解析(四)(模型) - 通过EMF扩展BPMN2.0元素 Fixflow引擎解析(三)(模型) - 创建EMF模型来读写XML文件 Fixflow引擎解析(二)(模型) - BPMN ...

  3. Java基础知识强化之IO流笔记71:NIO之 NIO的(New IO流)介绍

    1. I/O 简介 I/O ( 输入/输出  ):指的是计算机与外部世界或者一个程序与计算机的其余部分的之间的接口.它对于任何计算机系统都非常关键,因而所有 I/O 的主体实际上是内置在操作系统中的. ...

  4. 分享一个字数限制和统计的UITextView分类方法

    - (NSUInteger)letterCountWithLimits:(NSInteger)limits { NSString *toBeString = self.text; NSUInteger ...

  5. 基于MVVM的知乎日报应用安卓源码

    使用data binding , dagger2 , retrofit2和rxjava实现的,基于MVVM的知乎日报APP运行效果: <ignore_js_op> 使用说明: 项目结构 a ...

  6. GitHub帮助文档翻译2——contribution

    工欲善其事必先利其器 ,都不知道 GitHub到底是什么,还怎么玩?因为总是会读了第一句就忘了下一句,形成不了感觉,所以希望把读GitHub的帮助文档都翻译出来,总是看大段大段的东西,谁都会懵圈的.希 ...

  7. 用Windows Server 2003搭建企业内部邮件服务器

    公司要搭建一个邮件服务器,方便内部邮件的发送.而且要求每位员工都可以使用自己的账号和密码.领导将这份工作交给我,不过,这可难不倒我.只要借助Windows Server 2003就可以轻松建起内部邮件 ...

  8. Android 自学之进度条ProgressBar

    进度条(ProgressBar)也是UI界面中的一种非常使用的组件,通常用于向用户显示某个耗时完成的百分比.因此进度条可以动态的显示进度,因此避免长时间地执行某个耗时操作时,让用户感觉程序失去了响应, ...

  9. Quartus II 11.0 开始使用

    一.Altera Quartus II 11.0套件介绍 所谓巧妇难为无米之炊,再强的软硬件功底,再多的思维创造力,没有软件的平台,也只是徒劳.因此,一切创造的平台——Quartus II 软件安装, ...

  10. 关于apple watch(苹果表)

      如何升级呢? 对于Apple Watch用户来说,只要打开Apple Watch的iPhone应用,打开主菜单然 后选择软件升级,就能下载升级文件.新版本可以无线安装.需要注意的是,在升级 wat ...