HTML DOM Style top 屬性

2018-08-04 20:41 更新

Style top 屬性

Style 對(duì)象參考手冊(cè) Style 對(duì)象

定義和用法

top 屬性設(shè)置或返回定位元素的頂部位置。

該屬性規(guī)定了元素的頂部位置,包括:內(nèi)邊距、滾動(dòng)條、邊框和外邊距。

提示:一個(gè)定位元素是元素的 position 屬性被設(shè)置為:relative(相對(duì))、absolute(絕對(duì))或 fixed(固定)。

語(yǔ)法

設(shè)置 top 屬性:

Object.style.top="auto|length|%|inherit"

返回 top 屬性:

Object.style.top

描述
auto 默認(rèn)。通過(guò)瀏覽器計(jì)算頂部的位置。
length 使用 px、cm 等單位定義元素的頂邊到最近一個(gè)具有定位設(shè)置父元素的頂部邊緣的位置。可使用負(fù)值。
% 定義元素的頂邊到最近一個(gè)具有定位設(shè)置父元素的頂部邊緣的百分比位置。
inherit top 屬性的值從父元素繼承。


瀏覽器支持

Internet ExplorerFirefoxOperaGoogle ChromeSafari

所有主要瀏覽器都支持 top 屬性。

注意:IE7 及更早的版本不支持 "inherit" 值。IE8 只有規(guī)定了 !DOCTYPE 才支持 "inherit"。IE9 支持 "inherit"。


實(shí)例

實(shí)例

設(shè)置按鈕的頂部位置:

<html>
<head>
<style type="text/css">
#b1
{
position:absolute;
}
</style>
<script>
function displayResult()
{
document.getElementById("b1").style.top="100px";
}
</script>
</head>
<body>

<input type="button" id="b1" onclick="displayResult()" value="Set top position to 100 px">

</body>
</html>

嘗試一下 ?


Style 對(duì)象參考手冊(cè) Style 對(duì)象
以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)