浮动float一般跟left或是right:

特性:

1,包裹性:浮动文本类型时,需要指定宽度width,如果不指定,就会折叠到最小宽度;

2,浮动会影响别的元素;

3,子级浮动,会导致父级高度塌陷。

表现:

1,浮动会脱离文档流(不受块级控制);

2,浮动不会超越到padding;

3,行内元素浮动后自动变成块级。

例子:

输出是:

在加上

.ti,.t2{

float:left;

}

变为:

这是个很简单的例子,但是在实践中这个大有用处!

CSS中的趣事之float浮动的更多相关文章

  1. 对CSS中的Position、Float属性的一些深入探讨

    对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个CSS属性,对于这两个属性的使用上面可能大多数人存在一些模糊与不 ...

  2. 装载:对CSS中的Position、Float属性的一些深入探讨

    对CSS中的Position.Float属性的一些深入探讨   对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个 ...

  3. css中常见几种float方式以及倒计时(刷新页面不清)

    css中常见几种float方式 http://jingyan.baidu.com/article/72ee561a670269e16138dfd5.html <script type=" ...

  4. 归纳篇(一)CSS的position定位和float浮动

    近期会更新一系列博客,对基础知识再度做个巩固和梳理. 一.position定位 (一):position的属性 1.absolute:生成绝对定位的元素,相对于最近一级定位不是static的父元素来进 ...

  5. CSS中的position和float

    对基础知识再度做个巩固和梳理. 一.position定位 (一):position的属性 1.absolute:生成绝对定位的元素,相对于最近一级定位不是static的父元素来进行定位: 2.rela ...

  6. (转)css中通常会用到浮动与清除,也是一个必须掌握的知识点,概念性的东西不多说,下面举几个例子,来说明它的用法:1.文字环绕效果 2.多个div并排显示 3.清除浮动(默认显示)

    一.文字环绕效果: html代码如下: 1 <body> 2 3 <style type="text/css"> 4 #big img {float: le ...

  7. css中:overflow:hidden清除浮动的原理

    要想彻底清除浮动的影响,适合的属性不是 clear 而是 overflow. 一般使用 overflow:hidden,利用 BFC 的“结界”特性彻底解决浮动对外部或兄弟元素的影响. 1. 前言: ...

  8. 关于css中float的理解

    感觉css里的float是个非常神奇的东西,神奇之处在于,你知道它是什么意思,但是用的时候总是不知道怎么实现效果.又或者它会很容易地影响到别的元素和属性.所以今天打算尝试一下float的各种设置,看看 ...

  9. 【Web】CSS中的浮动float

    CSS中的float 文章目录 CSS中的float 1.float浮动属性 2.float文字环绕图片 3.float浮动的真正原因以及副作用分析 4.清除浮动的四种解决方法 5.实际应用 导航效果 ...

随机推荐

  1. git 团队代码管理交流共同进步

    Installation methods for GitLab | GitLab https://about.gitlab.com/installation/#centos-7 gittutorial ...

  2. cocos2d-x 打包成so文件之后,假设出现错误,能够使用ndk-stack来查看里面的异常

    cocos2d-x  打包成so文件之后,假设出现错误,能够使用ndk-stack来查看里面的异常 详细方法.自行百度.

  3. 3.5Linux设备驱动--块设备(一)之概念和框架☆☆

    基本概念   块设备(blockdevice) --- 是一种具有一定结构的随机存取设备,对这种设备的读写是按块进行的,他使用缓冲区来存放暂时的数据,待条件成熟后,从缓存一次性写入设备或者从设备一次性 ...

  4. Mac 中安装 Apache Ant

    1.下载Apache Ant:http://ant.apache.org/bindownload.cgi 2.解压apache-ant-1.9.6-bin.zip,把解压好的apache-ant-1. ...

  5. 守护线程Daemon的理解

    1.守护线程伴随着主线程的销毁而销毁: 2.jvm虚拟机中有很多守护线程,随着main函数的结束而结束,自动回收栈中的内容. Thread t1 = new Thread(){ @Override p ...

  6. VMware虚拟机安装WinXP出现错误output error file to the following location A:\GHOSTERR.TXT

    我们安装Ghost版WinXP系统的时候,可能会出现一个如下图这样的错误:output error file to the following location A:\GHOSTERR.TXT. 出现 ...

  7. bzoj1046 [HAOI2007]上升序列——LIS

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=1046 倒序求最长下降子序列,则得到了每个点开始的最长上升子序列: 然后贪心输出即可. 代码如 ...

  8. 10_传智播客iOS视频教程_NSString

    从今天开始不会再去用C语言当中的字符串.因为OC当中设计了一种更为好用的存储字符串的变量. C的字符串和OC的字符串是有区别的. NSString类型的指针变量,只能存储OC字符串的地址.第一步是声明 ...

  9. CodeForces 721B Passwords (水题)

    题意:给定 n 个密码,你要按长度不递减的顺序进行尝试,问你最多和最少试多少次可能找出密码,每尝试 k 次错误的,就要等5秒. 析:我们只要把长度全都统计下来,然后从1开始去找目标长度,最少的就是正好 ...

  10. 3 Java对象的内存布局以及对象的访问定位

    先来看看Java对象在内存中的布局   一 Java对象的内存布局 在HotSpot虚拟机中,对象在内存中的布局分为3个区域 对象头(Header) Mark Word(在32bit和64bit虚拟机 ...