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. iOS开发——高级技术&生成二维码

      生成二维码 因为项目里需要新增个功能,该功能用到了二维码技术.于是我便查阅了资料,先学习了二维码的生成. 我们使用libqrencode库来生成二维码.下载地址http://download.cs ...

  2. careercup-中等难度 17.9

    17.9 设计一个方法,找出任意指定单词在一本书中的出现频率. 解法: 1 单次查询 遍历这本书的每个单词,计算给定单词出现的次数.时间复杂度O(n),我们无法继续优化它,因为书中的每个单次都需要访问 ...

  3. mod_rewrite模块详解

    mod_rewrite模块提供了一个基于规则的(使用正则表达式分析器的)实时转向URL请求的引擎. 支持每个规则可以拥有不限数量的规则以及附加条件规则的灵活而且强大的URL操作机制. 此URL操作可以 ...

  4. 详解 Objective-C 中的 Runtime

    公司项目用到一个三方开源库,里面有个bug,不能改动源码,我想来想去,只能通过runtime这个万能的手段来解决.但是runtime 并不怎么会用,怎么办,马上学习呗.说到runtime,它是Obje ...

  5. Linux Shell产生16进制随机数

    n为字符长度 openssl rand -hex n

  6. 盒模型Box Model(浮动)

    一.标准盒模型的大小:border+padding+content(width)        怪异盒模型大小:padding+border   二.display inline  默认,且变为行由内 ...

  7. C# 接口的隐式与显示实现【转】

    以前在用到接口时,从来没注意到接口分为隐式实现与显示实现.昨天在浏览博客时看到相关内容,现在根据自己的理解记录一下,方便日后碰到的时候温习温习.通俗的来讲,“显示接口实现”就是使用接口名称作为方法名的 ...

  8. 第五章 jQuery中的动画

    通过jQuery中的动画方法,能轻松地为网页添加精彩的视觉效果,给用户一种全新体验. 1.show()方法和hide()方法 该方法的功能与css()方法设置display属性效果相同. 给show( ...

  9. ASP.NET MVC 4应用程序文件夹

    App_Start It has configuration classes to reduce clutter code in the Global.asax 它包含了配置类来减少在Global.a ...

  10. 关于TouchEvent中出现异常:MessageQueue-JNI问题

    Tag:MessageQueue-JNI Exception dispatching input event. Exception in MessageQueue callback: handleRe ...