Element: clientTop 属性
Element 接口的只读属性 clientTop 返回元素顶部边框的宽度（以像素为单位）。
offsetTop 和 clientTop 之间的所有内容就是元素的边框。这是因为 offsetTop 指的是边框的顶部位置（而不是外边距），而客户端区域紧接着边框下方开始，包括内边距。因此，clientTop 的值始终等于 border-top-width，四舍五入为整数。例如，如果计算出的 border-top-width 为零，则 clientTop 也为零。
值
一个整数。
示例
在下面的示例中，客户端区域具有白色背景和 24px 的黑色 border-top。clientTop 值是从外边距（黄色）区域结束到内边距和内容区域（白色）开始的距离：即 24px。
HTML
html
<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 |
浏览器兼容性
加载中…