position: relative; 是CSS中的一个定位属性，用于相对定位元素。
当将一个元素的 position 属性设置为 relative 时，该元素会相对于其在正常文档流中的位置进行偏移，但不会影响其他元素的布局。使用相对定位可以通过调整 top 、 right 、 bottom 和 left 属性来改变元素的位置。
下面土嘎嘎小编分享一个示例代码，展示了如何使用 position: relative; 来相对定位一个元素：
〓〓html代码如下：〓〓
<div class="relative-box">
This is a relatively positioned element.
</div>
〓〓css代码如下：〓〓
.relative-box {
position: relative;
top: 20px;
left: 30px;
background-color: #F0F0F0;
padding: 10px;
}
在上面给出的示例中，我们创建了一个 <div> 元素，并为其添加了一个名为 .relative-box 的类。
通过将 .relative-box 类的 position 属性设置为 relative ，我们将该元素设置为相对定位。
接下来，通过调整 top 和 left 属性，我们将元素相对于其正常文档流中的位置向下偏移20像素，向左偏移30像素。
此外，我们还设置了一些其他样式属性，例如 background-color 和 padding ，以便更好地展示相对定位的效果。
土嘎嘎技术网友情提示：相对定位会保留元素在正常文档流中所占据的空间，其他元素不受其位置变化的影响。这与绝对定位（ position: absolute; ）的行为有所不同，后者会使元素脱离文档流，并可能导致其他元素的重叠或位置变化。