position: relative;
position: relative; 的元素相对于其正常位置进行定位。
设置相对定位的元素的 top、right、bottom 和 left 属性将导致其偏离其正常位置进行调整。不会对其余内容进行调整来适应元素留下的任何空间。
实例代码：
<!doctype html>
<html>
<head>
<style>
div.relative{
border:3px solid green;
left:30px;
position:relative; /*设置相对定位*/
width:500px;
}
</style>
</head>
<body>
<h1>position:relative 属性相对定位实例</h1>
<div class="relative">
这个div元素设置position:relative;
</div>
<p>设置 position: relative; 的元素相对于其正常位置进行定位。</p>
</body>
</html>
~
运行效果：
评论