[分享]css两个元素定位

CSS中，常见的两个元素定位方法为相对定位和绝对定位。

.relative {
  position: relative;
  left: 50px;
  top: 20px;
}

.absolute {
  position: absolute;
  right: 0;
  bottom: 0;
} 

相对定位

相对定位指的是元素相对于其原来的位置进行定位。使用此方法，需要设置元素的position属性为relative。

在上面的代码中，我们设置了class为relative的元素的位置向右移动了50个像素，向下移动了20个像素。实际上，元素本身的位置并未改变，仍然在原来的位置。而是在其原位置的基础上，相对移动了一定的距离。

绝对定位

绝对定位指的是元素相对于其最近的具有定位属性的父元素进行定位。如果不存在具有定位属性的父元素，则以浏览器窗口为准。使用此方法，需要设置元素的position属性为absolute。

在上面的代码中，我们设置了class为absolute的元素的位置相对于其父元素（即外层盒子）靠右下角对齐。如果外层盒子没有设置定位属性，则相对于浏览器窗口进行定位。

以上就是关于CSS中两种元素定位方法的介绍。相对定位和绝对定位可以帮助我们更准确地定位元素，使网页达到更好的视觉效果。