Relative: 属于文档流,针对自身进行偏移;

Absolute: 脱离文档流,针对最近的定位元素进行偏移,如果没有,则针对根元素,即body标签尽心偏移;

Fixed: 和absolute基本一致,唯一不同是,fixed针对视口进行偏移;

Sticky: 可以看作是相对定位和固定定位和混合体。这里有一个阀值的概念(使用top right bottom left)进行定义,超过阀值之前是相对定位,超过阀值之后是固定定位。

CSS - position属性小结的更多相关文章

  1. 【转载】CSS position属性和实例应用

    目前几乎所有主流的浏览器都支持position属性("inherit"除外,"inherit"不支持所有包括IE8和之前版本IE浏览器,IE9.IE10还没测试 ...

  2. 详解CSS position属性

    原文地址:http://luopq.com/2015/11/15/css-position/ position是CSS中非常重要的一个属性,通过position属性,我们可以让元素相对于其正常位置,父 ...

  3. css position 属性 (absolute 和fixed 区别)

    在css3中,position的属性值有:inherit, static, relative ,absolute, fixed. inherit 是继承父元素的position属性值,IE不支持. s ...

  4. CSS position 属性

    position: relative | absolute | static | fixed 参考网站:http://blog.csdn.net/dyllove98/article/details/8 ...

  5. CSS position属性absolute relative等五个值的解释

    DIV CSS position绝对定位absolute relative教程篇 常常使用position用于层的绝对定位,比如我们让一个层位于一个层内具体什么位置,为即可使用position:abs ...

  6. CSS position 属性_css中常用position定位属性介绍

    css可以通过为元素设置一个position属性值,从而达到将不同的元素显示在不同的位置, position定位是指定位置的定位,以下为常用的几种: 1.static(静态定位): 这个是元素的默认定 ...

  7. css position属性

    absolute, 屏幕为参照, 但固定在页面上,随页面滚动而动. fixed, 父元素没有指定position属性(或position属性为static时)==>屏幕为参照,固定在屏幕的某个位 ...

  8. CSS position属性 标签: css 2016-09-06 15:58 78人阅读 评论(0) 收藏

    踩了position的坑,主要是因为对position属性理解不深. 以下是w3school中对position的解释: 可能的值 值 描述 absolute 生成绝对定位的元素,相对于 static ...

  9. CSS position属性---absolute与relative

    详情请点击此链接 http://www.cnblogs.com/polk6/archive/2013/07/26/3214847.html

随机推荐

  1. ZOJ3175【公式化函数的思想】

    题意:  给出f(n,m)(m<n)的定义:大于m并且小于n的能整除m的数的个数. F(n)为m从1至n的f(n,m)的和. 给出n,求F(n). 思路: 就是计算n/1 +  n/2 + n/ ...

  2. Lightoj1080 【线段树】

    题意: 给你一个0/1的数组,然后给你n段区间,说这个区间里要反转一次,然后给你Q个询问,问你这个位置是什么: 思路: 我们线段树维护一下就好了额: 其实反转的话,还是算次数是不是,奇偶嘛: #inc ...

  3. Unity3d的批渲染 batch rendering

    http://blog.csdn.net/leonwei/article/details/41942157 批渲染(Batch) batch render 是大部分引擎提高渲染效率的方法,基本原理就是 ...

  4. ES6高级使用技巧(reduce,filter篇)

    本周总结 这几天在写Echarts自定义需求的时候发现了,图形化算法和函数式编程的应用场景,很多时候我们现在学的东西并一定在当前的这种状态有用,但是兴趣吧,喜欢就去学呗,没准在日后的工作日常中用到了 ...

  5. 黑马Lambda表达式学习 Stream流 函数式接口 Lambda表达式 方法引用

  6. Gitlab备份,Crontab定时备份

    1:Gitlab备份非常简单,只需要一条命令就可以创建完整的备份 gitlab-rake gitlab:backup:create 使用以上命令,就相当于在/var/opt/gitlab/backup ...

  7. localStorage和sessionStorage使用

    localStorage.setItem("key","value");//存数据 localStorage.getItem("key"); ...

  8. JDBC | 查询表数据行数

      两种方法: 1. "select * from userinfo" 利用ResultSet的last和getRow方法来获得ResultSet的总行数,适用于在查询数据的同时统 ...

  9. [題解](單調隊列dp)【2016noip福建夏令營】探險

    P1917 -- 探险 时间限制:1000MS      内存限制:131072KB 题目描述(explore.cpp) π+e去遗迹探险,遗迹里有 N 个宝箱,有的装满了珠宝,有的装着废品. π+e ...

  10. UVa12186:Another Crisis(树形DP)

    一道简单的树形DP送给你. A couple of years ago, a new world wide crisis started, leaving many people with econo ...