码迷,mamicode.com
首页 > 其他好文 > 详细

Position

时间:2018-09-23 16:36:36      阅读:127      评论:0      收藏:0      [点我收藏+]

标签:文档   ati   不为   abs   绝对定位   index   pos   fixed   对象   

1.static

    元素根据文档的正常流进行定位。top、right、bottom、left和z-index属性没有影响。这是默认值。

2.relative

    元素根据文档的正常流进行定位。然后根据的top、right、bottom和left值相对于自身进行偏移。偏移量不会影响任何其他元素的位置,因此,页面布局中元素的空间与static相同。

3.absolute

   元素从正常的文档流中删除,并且在页面布局中不为元素创建空间。它的位置相对于它最近的位置祖先(如果有的话),否则,它相对于初始包含快。它的最终位置由top、right和bottom的值决定。当z-index的值不是auto时,这个值创建一个新的堆栈上下文。绝对定位的盒子的边缘不会与其他边缘折叠。

   用途:可以悬浮在页面上方,遮挡下方的页面内容,可设置悬浮窗口。

4.fixed

    元素从正常的文档流中删除,并且在页面布局中不为元素创建空间。使用top、right、bottom、left等属性窗口为参考点进行定位,当出现滚动条时,对象不会随着滚动。而其层叠通过z-index属性定义。

    用途:窗口广告的固定位置。

5.sticky

   元素根据文档的正常流进行定位。然后相对于其最近的滚动祖先和包含快进行偏移。包括基于top值的表相关元素。right、bottom、left的偏移量不影响位置任何其他元素。这个值总是创建一个新的堆栈上下文。一个粘性元素“粘附”到其最近的祖先,该祖先具有滚动机制,即使该祖先不是最近的滚动祖先,这有效地抑制了任何“粘附”行为。

   

 

Position

标签:文档   ati   不为   abs   绝对定位   index   pos   fixed   对象   

原文地址:https://www.cnblogs.com/l69-l54/p/9690833.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!