position属性之relative

relative是一个CSS的定位属性，它用于将元素相对于其正常位置进行定位。这意味着，如果一个元素的position属性设置为relative，那么它仍然占据着其原本在文档流中的位置，但是在这个位置的基础上可以通过top, bottom, left和right属性进行微调和移动。相对定位是一个相对于元素自身定位的属性，因此移动的距离和方向是相对于元素自身的而不是相对于其父元素或页面的。

相关问题

position：relative

position: relative是CSS中的一个属性，用于相对定位元素。相对定位是根据元素在正常页面流中的位置来进行定位。相对于元素在文档流中的原始位置，使用top、left、bottom、right这四个属性可以将元素上下左右移动。相对定位不会使元素脱离文档流，而且会影响元素的其他兄弟元素。相对定位可以通过设置position属性的值为relative来实现。相对定位通常是在设置position:absolute的父元素上使用，这样子元素就会相对于父元素进行定位。如果没有设置position:relative的父元素，那么相对定位会逐层向上寻找设置了position:relative的元素边界，直到body元素。<span class="em">1</span><span class="em">2</span><span class="em">3</span><span class="em">4</span>

position: relative;

相对定位（position: relative）是CSS中一种定位方式，它可以根据元素在正常页面流中的位置来进行定位。相对定位不会使元素脱离文档流，而是在原始位置的基础上进行上下左右的移动。

要使用相对定位，需要将元素的position属性设置为relative。然后，可以使用top、left、bottom、right这四个属性来移动元素相对于其原始位置的距离。

以下是一个示例代码，演示了如何使用相对定位移动元素：

<style>
    .box {
        position: relative;
        top: 20px;
        left: 50px;
    }
</style>

<div class="box">
    这是一个相对定位的元素
</div>

在上面的示例中，我们将一个div元素的position属性设置为relative，然后使用top和left属性将其向下移动了20像素，向右移动了50像素。

请注意，相对定位会影响元素的其他兄弟元素，但不会影响元素在文档流中的位置，只是在文档流中移动了它的位置。