Style position 屬性

定義和用法

position 屬性設置或返回用于元素的定位方法的類型（靜態、相對、絕對或固定）。

另請參閱：

CSS 教程：CSS 定位

CSS 參考手冊：position 屬性

實例

例子 1

將 <div> 元素的定位從相對定位更改為絕對定位：

document.getElementById("myDIV").style.position = "absolute";

親自試一試

例子 2

使用不同的定位類型：

function myFunction(x)  {
  var whichSelected = x.selectedIndex;
  var posVal = x.options[whichSelected].text;
  var elem = document.getElementById("myDiv");
  elem.style.position = posVal;
}

親自試一試

例子 3

返回 <h2> 元素的定位：

alert(document.getElementById("myH2").style.position);

親自試一試

語法

返回 position 屬性：

object.style.position

設置 position 屬性：

object.style.position = "static|absolute|fixed|relative|sticky|initial|inherit"

屬性值

值 描述
static 元素按照它們咋文檔流中出現的順序呈現。默認。
absolute 元素相對于它的第一個定位的（非靜態）祖先元素進行定位。
fixed 元素相對于瀏覽器窗口進行定位。
relative

元素相對于其正常位置進行定位。

因此 "left:20" 將元素的左側位置增加 20 個像素。
sticky

元素根據用戶的滾動位置進行定位。

粘性元素根據滾動位置在 relative 和 fixed 之間切換。

它是相對定位的，直到在視口中遇到給定的偏移位置 - 然后它“粘”在適當的位置（如 position:fixed）。

注釋：不支持 IE/Edge 15 或更早版本。Safari 從 6.1 版開始支持 Webkit 前綴。
initial 將此屬性設置為其默認值。請參閱 initial。
inherit 從其父元素繼承此屬性。請參閱 inherit。

技術細節

默認值： static
返回值： 字符串，表示元素的位置類型。
CSS 版本： CSS2

瀏覽器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 支持 支持 支持 支持