zoukankan      html  css  js  c++  java
  • html学习笔记之position

    今天主要一直看试验position的各种属性,现在记录下来以此备忘。

    position有四种常有属性,分别是static,fixed.absolute,relative

    fixed就是相对于窗口的位置是不变的   比较好理解

    static  默认属性 遵循默认定位规则 这里面貌似是边界为之什么的都为0

    relative  相对以图片位置原来的位置的偏移   并且内容原来的位置仍然会留出空地

    如果不设置此选项则,当设置left:1000px时  内容的位置不会如想象般的向左移动1000px。

    absolute   这个属性最耗时间,一开始错误地以为可能就是从父标签的起始位置来算,但其实是absolute是相对于position属性非static值的最近父级元素进行偏移,如果父级都是static(文档流),则相对整个文档进行偏移(即body左上角坐标原点)。

    在此对偏移解释一下:

    个人理解:可以把position,fixed,static都想象成有实体的,占位置的内容;而absolute是虚的,没位置的;

    首先考虑一下这个问题:如果只有一个内容有absolute,而且这个absolute的内容的范围无限大,那么所有先与这个内容的html代码显示的东西都不会被覆盖,而所有后于这个内容的html代码显示的东西都会被覆盖,这是因为首先absolute内容确定了他的位置(根据之前的绿字部分),然后因为absolute的内容的原来位置会消失,所以absolute"漂"了起来,失去了位置,导致后面的内容都往上移动,这才导致的覆盖;

    PS:只是给自己看的,文字比较直白,高手勿喷。

  • 相关阅读:
    创建自定义图标和图像
    使用_CRTDBG_LEAK_CHECK_DF检查VC程序的内存泄漏(转)
    Hadoop Netflix数据统计分析2(转)
    系统提供的按钮和图标
    STATIC变量问题
    表格视图,文本视图和Web视图
    Hadoop Netflix数据统计分析1(转)
    获取程序数据路径(转)
    C++中STRING转为INT (转)
    netflix 推荐算法学习1(转)
  • 原文地址:https://www.cnblogs.com/jazzone/p/3456530.html
Copyright © 2011-2022 走看看