css 绝对位置相对位置

CSS中的绝对位置和相对位置是非常重要的概念。它们决定了元素在页面中的位置和布局。绝对位置是指元素相对于页面的绝对位置，而相对位置是指元素的位置相对于其父元素的位置。

/* 绝对位置 */
.absolute {
  position: absolute;
  top: 50px;
  left: 100px;
}

/* 相对位置 */
.relative {
  position: relative;
  top: 20px;
  left: 40px;
}

对于绝对位置，元素的位置相对于父元素的位置没有任何影响。例如，上面的代码中，类名为absolute的元素的位置是相对于页面的。而对于相对位置，元素的位置是相对于其父元素的位置。例如，上面的代码中，类名为relative的元素的位置是相对于其父元素的。

使用绝对和相对位置可以帮助我们在页面中实现非常灵活的布局。例如，当我们想要创建一个固定的导航菜单时，可以使用绝对位置将它固定在页面的某个位置。而当我们想要创建相对布局，可以利用相对位置来控制元素的位置和布局。