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. 插头dp的几个模板

    /* ural1519 求经过全部可行点的哈密顿回路的个数 括号匹配法,转移有点复杂,可是时间空间比較小 */ #include<cstdio> #include<cstring&g ...

  2. 基于Android 平台简易即时通讯的研究与设计[转]

    摘要:论文简单介绍Android 平台的特性,主要阐述了基于Android 平台简易即时通讯(IM)的作用和功能以及实现方法.(复杂的通讯如引入视频音频等可以考虑AnyChat SDK~)关键词:An ...

  3. 火狐HACK

     /*针对Firefox*/@-moz-document url-prefix() {    #nav{ width:200px; }} 

  4. 性能测试中用LambdaProbe监控Tomcat Tomcat和Probe的配置

    转载:http://bbs.51testing.com/thread-90047-1-1.html 性能测试中用LambdaProbe监控TomcatLambdaProbe 是一款强大的免费开源工具, ...

  5. c#_delegate_异步调用_BeginInvoke

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  6. 斐波那契数列_java版本

    package 斐波那契数列; public class fbnq { public static void main(String[] args){ System.out.println(fibon ...

  7. sql时间段算法

    需求:领导要求写时间段算法,格式如下 :-: :-: :-: :-: :-: :-: :-: :-: :-: :-: :-: :-: :-: :-: :-: :-: 一小时制 :-: :-: :-: ...

  8. 使用ueditor时候修改图片路径及其相关信息

    ueditor功能比较强大  使用也比较方便 但是有一些东西是需要我们自己根据实际情况去设置的 以下是关于图片/涂鸦/视频等上传信息的更改: 首先我们要找到配置文件config.json 注意不是co ...

  9. 开启nginx缓存

    proxy_cache_path和proxy_cache可以开启基础缓存 proxy_cache_path:缓存路径 proxy_cache:用来启用缓存

  10. 当 tcpdump -w 遇到 Permission denied

    为了定位问题,需要在Linux上使用tcpdump并且保存到文件,遇到了如下问题: tcpdump port 9001 -w xxtcpdump: xx: Permission denied 因为已经 ...