当一个容器内元素都浮动后,它将高度将不会随着内部元素高度的增加而增加,所以造成内容元素的显示超出了容器。

overflow:auto;是让高度自适应,
zoom:1;是为了兼容IE6,也可以用height:1%;的方式来解决

1、浮动

  浮动是CSS中用到的最多的一个选项,他有三个性质。关于浮动我们要强调一点,永远不是一个东西单独浮动,浮动都是一起浮动,要浮动,大家都浮动。

  1.1 浮动元素脱离标准文档流

    1.1.1
大概描述:有两个盒子,一个盒子浮动,一个盒子不浮动。浮动的盒子会脱离标准文档流,不浮动的盒子会在标准文档流中成为第一个,所以两者出现覆盖现象。

    

    1.1.2
大概描述:一个行内标签在标准文档流中是不能设置宽高的,但是使用float使其脱离文档流之后,就可以对其设置宽高了。所有浮动的标签不会去区分行内标签和块级标签。也就是说: 一旦一个元素浮动了,那么,将能够并排了,并且能够设置宽高了。无论它原来是个div还是个span。

  1.2 浮动的元素互相贴靠 

    以float向左浮动为例:

    如果有足够空间,那么就会靠着2哥。如果没有足够的空间,那么会靠着1号大哥。

    如果没有足够的空间靠着1号大哥,自己去贴左墙。

    

  1.3 浮动元素有“自围”的效果

    自围效果就是:浮动的盒子可以遮盖文档标准流的第一个盒子,但是不会遮盖里面的文字,文字会围绕浮动的盒子显示。

    在CSS代码中让div浮动,p不浮动,那么p中的文字就睡形成这种自围效果。

<</span>div>
<</span>img src="data:images/1.jpg" alt="" />
</</span>div>
<</span>p>123文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字
</</span>p>

    

zoom:1是什么意思的更多相关文章

  1. Nike Zoom Winflo 2 Kvinder Sko Når jeg set elementet

    De fleste af os elskede denne Nike Pegasus 34 foruden var ved at blive begejstret for at få dine ben ...

  2. css zoom属性兼容ie,firefox,chrome

    jquery代码: $("body").css({ "zoom":"2", "transform":"scal ...

  3. Selenium通过WebDriver控制IE浏览器出错 Browser zoom level was set to 109%. It should be set to 100%

    错误信息: WebDriverException: Message: Unexpected error launching Internet Explorer. Browser zoom level ...

  4. 关于scale和zoom的区别

    其实关于scale,我之前是用他来搞一些css3的特效的放大缩小啊,玩的也挺6666,而*zoom:1之前是用来做css的hack,也就是触发IE6/7的haslayout清除浮动的.终于某天,好事的 ...

  5. [WPF系列]-Deep Zoom

        参考 Deep Zoom in Silverlight

  6. CSS中不为人知Zoom属性的使用介绍(IE私有属性)

    其实Zoom属性是IE浏览器的专有属性,Firefox等浏览器不支持.它可以设置或检索对象的缩放比例.除此之外,它还有其他一些小作用,比如触发ie的hasLayout属性,清除浮动.清除margin的 ...

  7. zoom在css中的作用

    zoom:1 zoom:1;属性是IE浏览器的专有属性,Firefox等其它浏览器不支持.它可以设置或检索对象的缩放比例. 兼容IE6.IE7.IE8浏览器,经常会遇到一些问题,可以使用zoom:1来 ...

  8. zoom和transform:scale的区别

    小tips: zoom和transform:scale的区别 这篇文章发布于 2015年11月3日,星期二,00:52,归类于 css相关. 阅读 7876 次, 今日 8 次 by zhangxin ...

  9. 【 D3.js 进阶系列 — 6.1 】 缩放的应用(Zoom)

    缩放(Zoom)是另一种重要的可视化操作,主要是使用鼠标的滚轮进行. 1. zoom 的定义 缩放是由 d3.behavior.zoom() 定义的. var zoom = d3.behavior.z ...

  10. d3 API zoom

    常用的看明白了,还有几个地方不太明白. zoom函数: area path circle .on("zoom", function(){ that.svg_obj.select(& ...

随机推荐

  1. java调优(一)

  2. JAVA模板方法

    package project01; abstract class MyRuntime{ public final void runtime(){ long starttime =System.cur ...

  3. Kettle中忽略错误行继续执行

    在kettle执行的过程中,如果遇到错误,kettle会停止运行.在某些时候,并不希望kettle停止运行,所以就要处理下这些错误行. 例如这两天发现在一个转换中,总数出现一些不规则数据,这些数据一出 ...

  4. Django学习日记07_Admin

    django.contrib django.contrib是django中附带的一个工具集,由很多的附加组件组成.这些附加组件包括管理工具(django.contrib.admin).用户鉴别系统(d ...

  5. rsyslogd以及日志轮替logrotate的梳理

    rsyslog 1)日志类型 auth :(authpriv) 主要与认证有关的机制,例如 login, ssh, su 等需要帐号/密码的咚咚: cron: 就是例行性工作排程 cron/at 等产 ...

  6. 第四章:大数据 の HBase 基础

    本课主题 NoSQL 数据库介绍 HBase 基本操作 HBase 集群架构与设计介紹 HBase 与HDFS的关系 HBase 数据拆分和紧缩 引言 介绍什么是 NoSQL,NoSQL 和 RDBM ...

  7. Java框架之Spring(四)

    本文主要讲述在Spring中 1 注解方式装配 2 以自动扫描把组件纳入spring容器中管理 3 面象切面编程-代理的jdk 版实现 4 使用 Cglib 生成代理 5 aop编程的一些概念 6 使 ...

  8. Java学习笔记27(集合框架一:ArrayList回顾、Collection接口方法)

    集合:集合是java中提供的一种容器,可以用来存储多个数据 集合和数组的区别: 1.数组的长度是固定的,集合的长度是可变的 2.集合中存储的元素必须是引用类型数据 对ArrayList集合的回顾 示例 ...

  9. blog建表操作

    表思维导图:   数据库:表 from django.db import modelsfrom django.conf import settingsfrom django.contrib.auth. ...

  10. 【Splay】bzoj1500(听说此题多码上几遍就能不惧任何平衡树题)

    1500: [NOI2005]维修数列 Time Limit: 10 Sec  Memory Limit: 64 MBSubmit: 15112  Solved: 4996[Submit][Statu ...