zoom:1是什么意思

zoom:1是什么意思

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

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="images/1.jpg" alt="" /> </</span>div> <</span>p>123文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字 </</span>p>

    技术分享

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/114314.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • Java中遍历Set集合的三种方法「建议收藏」

    Java中遍历Set集合的三种方法「建议收藏」1.迭代遍历:Setset=newHashSet();Iteratorit=set.iterator();while(it.hasNext()){Stringstr=it.next();System.out.println(str);}2.for循环遍历:for(Stringstr:set){System.out.println(str);}…

  • 总结测试工程师面试题(含答案)「建议收藏」

    总结测试工程师面试题(含答案)「建议收藏」测试需求分析阶段:阅读需求,理解需求,主要就是对业务的学习,分析需求点,参与需求评审会议。2)、测试计划阶段:主要任务就是编写测试计划,参考软件需求规格说明书,项目总体计划,内容包括测试范围(来自需求文档),进度安排,人力物力的分配,整体测试策略的制定。风险评估与规避措施有一个制定。3)、测试设计阶段:主要是编写测试用例,会参考Prd文档(原型图),概要…

  • Linux文本处理神器awk实战案例

    Linux文本处理神器awk实战案例1.什么是awk2.打印不同列的内容3.打印行号和列号4.修改输入和输出分隔符5.输入多个文件6.修改某一列的值7.条件筛选后打印8.运算9.正则表达式

  • naviacat激活码[最新免费获取]

    (naviacat激活码)好多小伙伴总是说激活码老是失效,太麻烦,关注/收藏全栈君太难教程,2021永久激活的方法等着你。IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.cn/100143.html1STL5S9V8F-eyJsaWNlbnNlSW…

  • Laravel Model 的 fillable (白名单)与 guarded (黑名单)

    Laravel Model 的 fillable (白名单)与 guarded (黑名单)

    2021年10月25日
  • 二叉树abcdefghij先序遍历_二叉树后序遍历的非递归算法

    二叉树abcdefghij先序遍历_二叉树后序遍历的非递归算法给定一个二叉树,判断其是否是一个有效的二叉搜索树。假设一个二叉搜索树具有如下特征:节点的左子树只包含小于当前节点的数。节点的右子树只包含大于当前节点的数。所有左子树和右子树自身必须也是二叉搜索树。题解深搜/** * Definition for a binary tree node. * struct TreeNode { * int val; * TreeNode *left; * TreeNode *right; * TreeNode() :

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号