[分享]css另一个元素top

CSS的另一个常用元素就是top属性。它用来确定一个元素的上边缘距离其定位父元素上边缘的距离。.example { : absolute; top: 20px; } 在上面的代码中，.example元...

CSS的另一个常用元素就是top属性。它用来确定一个元素的上边缘距离其定位父元素上边缘的距离。

.example {
  position: absolute;
  top: 20px;
} 

在上面的代码中，.example元素被设置为绝对定位，距离其定位父元素上边缘的距离为20像素。

top属性的取值可以是一个固定的像素值，也可以是一个百分比值。当使用百分比值时，它是相对于定位父元素的高度而言的。

.example {
  position: absolute;
  top: 50%;
} 

在上面的代码中，.example元素被设置为绝对定位，距离其定位父元素上边缘的距离为父元素高度的50%。

需要注意的是，如果一个元素没有被设置为定位元素，那么top属性是不会起作用的。

.example {
  top: 20px; /* 这里的top属性不起作用 */
} 

最后，需要提醒的是，如果一个元素的height属性为auto，那么它的top属性是不会起作用的。因为这时元素的高度是根据其内容自动决定的，没有一个确定的高度值可以计算距离。