您现在的位置:首页 >> 前端 >> 内容

position属性解析

时间:2016/11/28 9:24:00 点击:

  核心提示:依旧是面试时做错的题。position一共有四个值,static,relative,absolute,fixed。接下来我们一个一个来讲解。static在css中所有元素的position属性的默认值...

依旧是面试时做错的题。

position一共有四个值,static,relative,absolute,fixed。
接下来我们一个一个来讲解。

static

在css中所有元素的position属性的默认值都是static,因此不需要显式的为每个元素设置“position:static”。

relative

relative即为相对定位。它有几个特点:

相对定位相对的是元素原本所在的位置。 设置相对定位后,可以通过top left bottom right来对元素进行定位。但是元素移动后,原来所占有的空间依旧占有。

relative定位之后,不会影响它周围的元素。

absolute

absolute为绝对定位。需要注意的是,绝对定位会使元素脱离文档流。并且原本元素所占有的空间也不再占据空间。
绝对定位是相对于最近的“被定位的父元素”进行定位。如果没有被定位的父元素,那么该元素则相对于body进行定位。

fixed

fixed顾名思义即为固定定位。它的参照是当前浏览器的窗口,一般可以用来设置固定在顶部or底部的导航栏。

最后还是要说,基础很重要,不要忽视。
好好学习,打牢基础。

Tags:PO OS SI IT 
作者:网络 来源:u014086845