1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
|
---
title: Element.clientTop
slug: Web/API/Element/clientTop
tags:
- API
- CSSOM View
- 属性
translation_of: Web/API/Element/clientTop
---
<p>{{ APIRef("DOM") }}</p>
<p>一个元素顶部边框的宽度（以像素表示）。不包括顶部外边距或内边距。<code>clientTop</code> 是只读的。</p>
<p>基于 <a href="https://developer.mozilla.org/zh-CN/docs/Web/API/en/Gecko">Gecko</a> 的应用从 Gecko 1.9（<a href="https://developer.mozilla.org/zh-CN/docs/Web/API/en/Firefox_3">Firefox 3</a> {{ Bug(111207) }}）开始支持 clientTop。该属性在 Firefox 2 或更早的版本中不被支持。</p>
<h2 id="语法">语法</h2>
<pre class="brush: js">var top = element.clientTop;</pre>
<h2 id="示例">示例</h2>
<div id="offsetContainer" style="margin: 40px 50px 50px; background-color: rgb(255, 255, 204); border: 4px dashed black; color: black; position: relative; display: inline-block;">
<div id="idDiv" style="margin: 24px 29px; padding-right: 28px; padding-left: 28px; border: 24px solid black; width: 199px; height: 102px; overflow: auto; font-family: Arial, sans-serif; font-size: 13px !important; background-color: white;">
<p id="PaddingTopLabel" style="margin-bottom: 0px; text-align: center; font-style: italic; font-weight: bold;">padding-top</p>
<p>Gentle, individualistic and very loyal, Birman cats fall between Siamese and Persian in character. If you admire cats that are non aggressive, that enjoy being with humans and tend to be on the quiet side, you may well find that Birman cats are just the felines for you.</p>
<p>All Birmans have colorpointed features, dark coloration of the face, ears, legs and tail.</p>
<p>Cat image and text coming from <a class="external external-icon" href="http://www.best-cat-art.com/">www.best-cat-art.com</a></p>
<p id="PaddingBottomLabel" style="margin-bottom: 0px; text-align: center; font-style: italic; font-weight: bold;">padding-bottom</p>
</div>
<strong style="color: blue; font-family: Arial,sans-serif; font-size: 13px !important; font-weight: bold; left: -32px; position: absolute; top: 85px;">Left</strong><strong style="color: blue; font-family: Arial,sans-serif; font-size: 13px !important; font-weight: bold; left: 170px; position: absolute; top: -24px;">Top</strong><strong style="color: blue; font-family: Arial,sans-serif; font-size: 13px !important; font-weight: bold; left: 370px; position: absolute; top: 85px;">Right</strong><strong style="color: blue; font-family: Arial,sans-serif; font-size: 13px !important; font-weight: bold; left: 164px; position: absolute; top: 203px;">Bottom</strong><em>margin-top</em><em>margin-bottom</em><em>border-top</em><em>border-bottom</em></div>
<h2 id="Notes" name="Notes" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">备注</h2>
<p><code>clientTop</code> 首次出现于 MS IE DHTML 对象模型中。</p>
<h2 id="References" name="References" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">相关链接</h2>
<ul>
<li><a href="https://docs.microsoft.com/en-us/previous-versions//hh781509(v=vs.85)">MSDN: Measuring Element Dimension and Location</a></li>
</ul>
|
