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>

    技术分享

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

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

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • JRTPLIB使用实例

    JRTPLIB使用实例这几天在看关于JRTPLIB方面的东西。在网上看了不少文章,其中有很大部分使用的JRTPLIB版本在3.0以下。在网上下载了一个JRTPLIB-3.7的库,发现里面的函数接口做了一些修改。现奉上一篇基

    2022年7月2日
    24
  • redis常用指令

    redis常用指令

    2021年8月2日
    52
  • Eclipse中使用SVN[通俗易懂]

    Eclipse中使用SVN[通俗易懂]概述在我们的日常工作中,经常会用到SVN,大多数都是搭配Eclipse/MyEclipse使用。本文主要介绍SVN在Eclipse中的一些最长用的功能,包括SVN插件的下载使用、上传代码到服务器、从服务器下载代码、从服务器更新代码、解决代码冲突。本文链接:http://blog.csdn.net/v123411739/article/details/225121331.在Eclipse里下载Sub…

    2022年6月3日
    37
  • Verilog hdl与VHDL混用详解

    Verilog hdl与VHDL混用详解Veriloghdl与VHDL混用详解1.概述由于在FPGA开发过程中,多人合作时可能遇到有人使用veriloghdl,有人遇到VHDL的情况,这就涉及到了veriloghdl与VHDL的相…

    2022年9月21日
    1
  • 5G科普——5G切片[通俗易懂]

    5G科普——5G切片[通俗易懂]切的是什么?先了解为什么会提出网络切片这一概念。5G服务是多样化的,包括车联网、大规模的互联网、工业自动化、远程医疗、VR/AR等这些服务对我们的要求是不一样的,有的低延时、高可靠;有的高清、高速率;有的大连接、低移动性;因此5G网络要满足差异化的业务,需要能够像搭积木一样灵活部署,方便新业务的上线下线,于是网络切片这一概念应运而生。3GPP定义:网络切片是提供特定网络能力和网络特性的逻辑网…

    2022年10月2日
    2
  • Redmi Note 10pro参数_小米note10pro配置

    Redmi Note 10pro参数_小米note10pro配置RedmiNote10Pro采用了旗舰级外观设计,193g超轻体量却内藏5000mAh大电量,还有三款绝美配色。「幻青」如阳光照耀下的海洋,碧波荡漾;「月魄」如夜晚澄空里的明月,流光皎洁;「星砂」如浩瀚苍穹中的星光,璀璨闪耀。红米手机爆降880这活动太给力了机会不容错过http://xiaomi.adiannao.cn/1RedmiNote10Pro搭载四主镜头,分别为1.08亿像素的广角主镜头、800万像素的超广角镜头、500万像素的长焦微距镜头和200万像素的景深镜

    2022年8月10日
    23

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

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