在网页设计和开发中，CSS（层叠样式表）是不可或缺的组成部分，它可以控制网页的外观和布局。其中，position是CSS中用于控制元素定位的属性，它能够让我们为元素设置绝对、相对或固定的位置，从而实现更加复杂的布局效果。

在这篇文章中，我们将详细介绍position CSS属性的使用方法，以及如何将它应用于布局网页元素。

一、position属性的基本介绍

position属性是CSS中用于控制元素定位的属性，它共有四个值：static、relative、absolute和fixed。

1.static：默认值，元素按照正常流排列，不考虑top、bottom、left、right属性的设置。

2.relative：相对定位，元素相对于它本身的位置进行移动，元素仍然占据原有的空间。

3.absolute：绝对定位，元素相对于其最近的非static定位的祖先元素进行定位，如果没有定位的祖先元素，则相对于文档（document）本身。

4.fixed：固定定位，元素的位置相对于浏览器窗口固定，不随页面滚动而改变。

二、相对定位的使用

在CSS中，相对定位的作用是使元素相对于它本身的位置进行移动，并不会脱离文档流。相对定位可以通过为元素添加position: relative属性来实现。

例如：

```