浮动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. 聚合类新闻client初体验

    初体验的产品:今日头条(ios3.6).百度新闻(ios4.4.0).ZAKER(ios4.4.5).鲜果(ios3.8.7).中搜搜悦(ios4.0.1).Flipboard(ios2.3.9) 1 ...

  2. mysql11---主键普通全文索引

    .1主键索引添加 当一张表,把某个列设为主键的时候,则该列就是主键索引 create table aaa (id int unsigned primary key auto_increment , n ...

  3. linux怎么区别文本文件和二进制文件

    linux的文本文件与二进制文件的区分与windows的区分是相同的!说到底计算机存储的文件都是以二进制形式存储的,但是区别是,习惯上认为: (1).文本文件 文本文件是包含用户可读信息的文件.这些文 ...

  4. 基于TCP的字符串传输程序

    ---恢复内容开始--- LINUX中的网络编程是通过SOCKET接口来进行的. Socket(套接字) Socket相当于进行网络通信两端的插座,只要对方的Socket和自己的Socket有通信联接 ...

  5. YTU 2811: 打鱼还是晒网

    2811: 打鱼还是晒网 时间限制: 1 Sec  内存限制: 128 MB 提交: 192  解决: 150 题目描述 中国有句俗话"三天打鱼,两天晒网".小王从2000年的1月 ...

  6. tcp/ip网络通讯安全加密方法

    tcp/ip网络通讯安全是一个广受关注的话题,现在也有一些基于tcp/ip加密技术标准如SSL,TLS等.但很多时候编写一些简单的网络通讯把这标准加密应用添加进来乎一下子把程序变得复杂了,而实现自己的 ...

  7. Spring注解详细

    1.@controller 控制器(注入服务) 2.@service 服务(注入dao) 3.@repository dao(实现dao访问) 4.@component (把普通pojo实例化到spr ...

  8. 【WIP】gollum

    创建: 2018/03/18 [任务表]TODO 这个博客从来不点发布到首页, 完全100%自用, 全部详细完整的干货.千辛万苦找到这里看到一片空白, 是不是很愤怒? 那就对啦233333

  9. HDU3092:Least common multiple(素数筛选+完全背包)

    题意 给出\(n\)和\(m\),将\(n\)拆成任意个数,求它们的最大的\(lcm\) 分析 1.可以证明\(n=p1^{s1}*p2^{s2}*...*pn^{sn}\)时\(lcm\)最大(其中 ...

  10. bzoj 1922: [Sdoi2010]大陆争霸【dijskstra】

    d[u]为u被几个节点保护,d1[u]为最早到u的时间,d2[u]为u的最早可进入时间(保护点都被打下来了的时候),然后最终最早进入时间就是max(d1[u],d2[u]),把这个作为权值放进小根堆, ...