css 绝对定位下方控件位置

CSS绝对定位让我们可以将一个元素的位置精确地定位到一个给定的位置。在绝对定位下，元素的位置是相对于其最近的已定位的祖先元素而言的（如果该祖先元素不存在，则相对于初始包含块定位）。可以使用top和bottom属性来控制元素的上下位置。

.absolute {
      position: absolute;
      bottom: 10px;
 /*距离最近的已定位祖先元素的底部距离为10px*/}
 

在上述代码中，我们将.bottom的元素的底部与其祖先元素的底部相距10px，这里的祖先元素可以是任意已定位的元素。如果没有已定位的祖先元素，则相对于初始包含块进行定位。

.relative {
      position: relative;
}
.absolute {
      position: absolute;
      bottom: 10px;
 /*距离已定位祖先元素.relative的底部距离为10px*/}
    

在上面的代码中，我们在.relative元素中给absolute元素一个已定位的祖先元素。bottom属性是相对于这个祖先元素的底部定位的，这样我们就可以将absolute元素放在relative元素下面。

绝对定位下方控件位置的方法就是通过控制元素相对于其祖先元素（最近的已定位元素）的bottom属性来实现的。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！