元素：clientTop 属性

元素顶部边框的宽度（以像素为单位）。它是元素的一个只读整数属性。

实际上，这两个位置（offsetTop 和客户端区域顶部）之间只有元素的边框。这是因为offsetTop 指示边框顶部的坐标（而不是外边距），而客户端区域从边框下方开始（客户端区域包含内边距）。因此，clientTop 的值始终等于 "border-top-width" 的 .getComputedStyle() 值的整数部分。（实际上可能是 Math.round(parseFloat())）。例如，如果计算出的 "border-top-width" 为零，则clientTop 也为零。

注意：此属性会将值舍入为整数。如果您需要小数值，请使用element.getBoundingClientRect()。

<div id="container">
  <div id="contained">
    <p>
      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
      veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
      commodo consequat.
    </p>
  </div>
</div>

CSS

css

#container {
  margin: 3rem;
  background-color: rgb(255 255 204);
  border: 4px dashed black;
}

#contained {
  margin: 1rem;
  border-top: 24px black solid;
  padding: 0px 28px;
  overflow: auto;
  background-color: white;
}

规范
CSSOM 视图模块 # dom-element-clienttop

浏览器兼容性

BCD 表格仅在浏览器中加载

元素：clientTop 属性

值

示例

HTML

CSS

结果

注释

规范

浏览器兼容性