zoukankan      html  css  js  c++  java
  • css 浮动和绝对定位的区别

      当一个元素使用绝对定位后,它的位置将依据浏览器左上角开始计算或相对于父容器(在父容器使用相对定位时)。 绝对定位使元素脱离文档流,因此不占据空间。普通文档流中元素的布局就当绝对定位的元素不存在时一样。因为绝对定位的框与文档流无关,所以它们可以覆盖页面上的其他元素。 

    w3c对绝对定位的解释:

      设置为绝对定位的元素框从文档流完全删除,并相对于其包含块定位,包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭,就好像该元素原来不存在一样。元素定位后生成一个块级框,而不论原来它在正常流中生成何种类型的框

      

    w3c对浮动的解释:

      浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。 由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样

    这里的就好像不存在了一样是又区别的。 绝对定位会有覆盖出现,而浮动这是包围在浮动元素的周围(没有覆盖),文档流中的其他元素将忽略该元素并填补他原先的空间。它只是改变了文档流的显示,而没有脱离文档流

    一个元素浮动或绝对定位后,它将自动转换为块级元素,而不论该元素本身是什么类型。

  • 相关阅读:
    Linux密码文件介绍
    MongoDB与微服务
    MongoDB应用场景及选型
    MongoDB性能诊断工具
    1.7每日进度
    《架构即未来》(3)
    《架构即未来》(2)
    论面向服务架构设计
    浅谈MVC设计模式
    《架构即未来》(1)
  • 原文地址:https://www.cnblogs.com/haojiahong/p/4746441.html
Copyright © 2011-2022 走看看