zoukankan      html  css  js  c++  java
  • 细说CSS样式表中的position属性

    在CSS中关于position定位的内容是:
    position: relative | absolute | static | fixed

    static(静态) 没有特别的设定,遵循基本的定位规定,不能通过z-index进行层次分级。

    relative(相对定位) 对象不可层叠、不脱离文档流,参考自身静态位置通过 top,bottom,left,right 定位,并且可以通过z-index进行层次分级。

    absolute(绝对定位) 脱离文档流,通过 top,bottom,left,right 定位。选取其最近一个最有定位设置的父级对象进行绝对定位,如果对象的父级没有设置定位属性,absolute元素将以body坐标原点进行定位,可以通过z-index进行层次分级。

    fixed(固定定位)这里所固定的参照对像是可视窗口而并非是body或是父级元素。可通过z-index进行层次分级。


    CSS中定位的层叠分级:z-index: auto | namber;
        auto 遵从其父对象的定位
        namber  无单位的整数值。可为负数


    relative(相对定位)只可以在文本流中进行位置的上下左右的移动,虽然他的表现区脱离了文本流,但是在文本流却依然为其保留了一席之地,这就好比一个打工的人他到了外地,但是在老家依然有一个专属于他的位置,这个位置不随他的移动而改变。这样很明显就会空出一块空白来,如果希望文本流抛弃这个部分就需要用到绝对定位。

    absolute(绝对定位)不光脱离了文本流,而且在文本流中也不会给这个绝对定位元素留下专属空位。这就好比是一个工厂里的职位,如果有一个工人走了自然会要有别的工人来填充这个位置。而移动出去的部分自然也就成为了自由体。绝对定位将可以通过TRBL(TOP、RIGHT、BOTTOM、LEFT简称TRBL)来设置元素,使之处在任何一个位置。在父层position属性为默认值时,TRBL的坐标原点以body的坐标原点为起始。

  • 相关阅读:
    luogu 2491 [SDOI2011]消防 / 1099 树网的核 单调队列 + 树上问题
    BZOJ 1179: [Apio2009]Atm tarjan + spfa
    BZOJ 1112: [POI2008]砖块Klo Splay + 性质分析
    BZOJ 1596: [Usaco2008 Jan]电话网络 树形DP
    BZOJ 2060: [Usaco2010 Nov]Visiting Cows 拜访奶牛 树形DP
    CF286E Ladies' Shop FFT
    CF528D Fuzzy Search FFT
    BZOJ 3771: Triple 生成函数 + FFT
    BZOJ 3513: [MUTC2013]idiots FFT
    python爬虫网页解析之parsel模块
  • 原文地址:https://www.cnblogs.com/xugang/p/1593030.html
Copyright © 2011-2022 走看看