zoukankan      html  css  js  c++  java
  • CSS之Position

    CSS2.0之后添加了Position,定位属性,主要包括四种

    • static:保持元素所在文档中的位置

      元素框正常生成。块级元素生成一个矩形框,作为文档流的一部分,行内元素则会创建一个或多个行框,置于其父元素中。

    • relative:相对于元素在文档中最原始的位置进行偏移,偏移量为设置的top/left/right/bottom
      • 参照位置为元素原始位置
      • 元素形状大小不会改变
      • 元素偏移之后,元素在文档中的原始空间仍旧保留

      元素框偏移某个距离。元素仍保持其未定位前的形状,它原本所占的空间仍保留。

    • absolute:绝对定位,当设置为absolute之后,会重新根据元素的填充生成一个新的块,偏移量为设置的top/left/right/bottom
      • 参照位置为其所有父元素中,最靠近元素本身的一个设置了position为非static的元素所处位置
      • 元素大小或形状会发生改变,会根据它的子元素重新生成为一个会计元素
      • 元素在文档中的原始空间不会包留,会被移除,后续其他兄弟元素补进
      • 当元素没有设置了position为非static的父元素时,相对位置为document的左上角

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

    • fixed

      元素框的表现类似于将 position 设置为 absolute,不过其包含块是视窗本身。

  • 相关阅读:
    爬虫心得
    WSL windows子系统ubuntu18.04建设自己的乌云
    WSL windwos 子系统 ubuntu18.04安装mysql
    python 163 email 554
    Centos 安装Oracle
    JS带进度 文件 重复 自动 异步上传
    xadmin 小组件默认折叠
    grep
    sed
    awk
  • 原文地址:https://www.cnblogs.com/holdhappiness/p/9850059.html
Copyright © 2011-2022 走看看