• 细说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的坐标原点为起始。

  • 相关阅读:
    C++报错undefined reference to vtable处理
    emplace_back无法支持<braceenclosed initializer list>吗?
    使用proxychains代理应用
    EasyExcel快速读写Excel数据
    解决SpringBoot跨域的三种方式
    SQL Server 锁(LOCK)大全
    MySQL预处理语句PREPARE、EXECUTE、DEALLOCATE使用大全
    C# 自定义泛型二维数组
    C# 一维数组与二维数组相互转换
    C#枚举高级应用
  • 原文地址:https://www.cnblogs.com/xugang/p/1593030.html
Copyright © 2020-2023  润新知