过渡放在原:
transiton:2s;

块无素:block,inline inline-block
1,占一行,有宽,有高
内元素:
2,无宽高,内容撑开宽高。不支持上下margin.代码换行补解析。
3, 一行,有宽,有高。不设宽度,要内容撑开。
float:
浮动元素
.clearfix{
*zoom:1;
}
.clearfix:after{
content:"",
display:block;
clear:both
}
float:none none
overflow:visible none
display:table-cell,inline-block,table-caption yes
position:relative static none
width heigh min-width min-height (auto) none

zoom:
float:relative
position:relative;
1,脱离文档流.[re lative]
2.

clearfix的更多相关文章

  1. clearfix的最佳方案----在路上(22)

    clearfix的纠结 骨灰级解决办法: .clear{clear:both;height:0;overflow:hidden;} 上诉办法是在需要清除浮动的地方加个div.clear或者br.cle ...

  2. clearfix的应用

    之前遇到一个问题,引用Bootstrap框架时 一行显示四个模块,小屏幕时显示两个模块 当内容一样时,大小屏幕时一样的,但是当其中一个和另一个内容不同时,展示效果就会有错乱 <div class ...

  3. bootstrap之clearfix

    bootstrap之clearfix 在bootstrap辅助类中有那么一类,是这么定义的: 利用clearfix样式清除浮动,但是前提条件是在超小型屏幕上能显示才行(因为其是用visible-xs样 ...

  4. 解读浮动闭合最佳方案:clearfix

    .clear{clear:both;height:0;overflow:hidden;} 上诉办法是在需要清除浮动的地方加个div.clear或者br.clear,我们知道这样能解决基本清浮动问题. ...

  5. clearfix清除浮动

    首先在很多很多年以前我们常用的清除浮动是这样的. 1 .clear{clear:both;line-height:0;} 现在可能还可以在很多老的站点上可以看到这样的代码,相当暴力有效的解决浮动的问题 ...

  6. ie7 用 clearfix 清除浮动时遇到的问题

    <!doctype html> <html> <head> <style> .fr{float:right;display:inline} li{bor ...

  7. css中clearfix清除浮动的用法及其原理示例介绍

    clearfix的定义: .clearfix:after {}{ content: "."; /**//*内容为“.”就是一个英文的句号而已.也可以不写.*/ display: b ...

  8. css用clearfix清除浮动

    本文从http://www.studyofnet.com/news/196.html复制.   本文导读:写css 时总为浮动而烦恼,如果用了浮动,浮动的父层不会跟着浮动框的高度增加而增加,在Fire ...

  9. [笔记]使用clearfix清除浮动

    转载自奶牛博客 .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { display: table; line-height: 0; ...

  10. clearfix清除浮动进化史

    我想大家在写CSS的时候应该都对清除浮动的用法深有体会,今天我们就还讨论下clearfix的进化史吧. clearfix清除浮动 首先在很多很多年以前我们常用的清除浮动是这样的. .clear{cle ...

随机推荐

  1. linux 跨IP拷贝命令 scp

    原文:http://blog.csdn.net/mexican_jacky/article/details/52847094 scp -r ROOT/ tms2api@10.230.4.215:/Ja ...

  2. 转:C的|、||、&、&&、异或、~、!运算

    转自:C的|.||.&.&&.异或.~.!运算 位运算     位运算的运算分量只能是整型或字符型数据,位运算把运算对象看作是由二进位组成的位串信息,按位完成指定的运算,得到位 ...

  3. JMX 简介 和 实例

    What is JMX? 10 mins Quick Start JMX Tutorial 这篇文章作为入门,非常清楚

  4. 20160808_Qt570安装

    1.安装的目录为 “/opt/Qt5.7.0/Tools/QtCreator/bin” 2.建立软连接 [root@localhost bin]# ln -s /opt/Qt5.7.0/Tools/Q ...

  5. c++11 其他特性(一)

    c++11还增加了许多有用的特性,比如: 1. 委托构造函数 如果一个类含有很多构造函数,这些构造函数有一些重复的地方,比如: class A{ public: A(){}; A(int a){ a_ ...

  6. modernizer的意义

    modernizer是一个js文件,会检查当前的浏览器支持什么特性,就在Html标签上添加什么类,然后如果不支持添加no-xxx类,这样,就可以针对两种情况写两种css. http://blog.ch ...

  7. entity reference在views中的运用

    一个views block可以获取从url过来的nid,某个node的有entity reference字段, 填入一点数据,然后在views里关联一下这个entity reference field ...

  8. !important css样式

    重要性 我们在做网页代码的时,有些特殊的情况需要为某些样式设置具有最高权值,怎么办?这时候我们可以使用!important来解决. 如下代码: p{color:red!important;} p{co ...

  9. Mybatis 学习-1

    本次MyBatis基础实例教程主要讲述MyBatis在项目中的配置方法,实体对象的关系映射.关联关系,以及如何实现一个BaseDao的功能 实例数据库的表结构 CREATE TABLE `blog_u ...

  10. Hadoop-env.sh[翻译]

    说明: 某天 ,把hadoop-env.sh的注释看了看 , 感觉受益匪浅,于是想要写一篇告诉大家,文档是最靠谱的,鉴于我的水平有限,只能翻译大概,切勿吐槽,提建议请留言 摘要: 1.这个文件中只有J ...