CSS position 小结

简介: CSS position 小结

position 属性规定应用于元素的定位方法的类型。决定元素是否受 top、bottom、left 和 right 属性影响。

其值及其含义如下:

static:静态定位,默认值,元素不受 top、bottom、left 和 right 属性的影响,始终根据页面的正常流进行定位。
relative:相对于其正常位置定位。
fixed:相对于视口定位,将始终位于页面中的同一位置,不受滚动影响。
absolute:对于最近的,position属性不是static的祖先元素进行定位,如果没有祖先,则会使用文档主体,并随页面一起滚动。
sticky:粘性元素根据滚动位置在相对(relative)和固定(fixed)之间切换。起先它会被相对定位,直到在视口中遇到给定的偏移位置为止 - 然后将其“粘贴”在适当的位置(比如 position:fixed)。

目录
相关文章
|
6月前
|
前端开发 容器
|
8月前
|
前端开发 容器
【CSS】定位属性position使用详解(static、relative、fixed、absolute)
css定位属性position:static、relative、fixed、absolute详细介绍及使用样例。
|
前端开发
web前端-CSS(display,position,overflow和浮动float)
web前端-CSS(display,position,overflow和浮动float)
110 0
|
前端开发 Linux 程序员
「CSS」知识点笔记:position
「CSS」知识点笔记:position
82 0
「CSS」知识点笔记:position
|
前端开发
CSS Position(定位)
CSS 有三种基本的定位机制:普通流、浮动和绝对定位。 除非专门指定,否则所有框都在普通流中定位。 也就是说,普通流中的元素的位置由元素在 HTML 中的位置决定。
132 0
CSS Position(定位)
|
前端开发
CSS3之position:sticky使用
CSS3之position:sticky使用
234 0
|
前端开发 开发者 容器
CSS position | 学习笔记
快速学习CSS position
80 0
CSS position | 学习笔记
|
编解码 前端开发 JavaScript
Canvas+HTML+CSS+Position定位
Canvas+HTML+CSS+Position定位
Canvas+HTML+CSS+Position定位
|
前端开发
|
前端开发
web前端-CSS(display,position,overflow和浮动float)
display(显示) display属性指定由元素生成的框的类型,通常用到display对应值有block、none、inline这三个值。 下面我们来看看display的属性有哪些吧。
web前端-CSS(display,position,overflow和浮动float)