?
This document uses PHP Chinese website manual Release
語(yǔ)法：
position：static | relative | absolute | fixed | center | page | sticky
默認(rèn)值：static
適用于：除display屬性定義為table-column-group | table-column之外的所有元素
繼承性：無(wú)
動(dòng)畫(huà)性：否
計(jì)算值：指定值
媒體：視覺(jué)
取值：
static：對(duì)象遵循常規(guī)流。此時(shí)4個(gè)定位偏移屬性不會(huì)被應(yīng)用。
relative：對(duì)象遵循常規(guī)流，并且參照自身在常規(guī)流中的位置通過(guò)top，right，bottom，left這4個(gè)定位偏移屬性進(jìn)行偏移時(shí)不會(huì)影響常規(guī)流中的任何元素。
absolute：對(duì)象脫離常規(guī)流，此時(shí)偏移屬性參照的是離自身最近的定位祖先元素，如果沒(méi)有定位的祖先元素，則一直回溯到body元素。盒子的偏移位置不影響常規(guī)流中的任何元素，其margin不與其他任何margin折疊。
fixed：與absolute一致，但偏移定位是以窗口為參考。當(dāng)出現(xiàn)滾動(dòng)條時(shí)，對(duì)象不會(huì)隨著滾動(dòng)。
center：與absolute一致，但偏移定位是以定位祖先元素的中心點(diǎn)為參考。盒子在其包含容器垂直水平居中。（CSS3）
page：與absolute一致。元素在分頁(yè)媒體或者區(qū)域塊內(nèi)，元素的包含塊始終是初始包含塊，否則取決于每個(gè)absolute模式。（CSS3）
sticky：對(duì)象在常態(tài)時(shí)遵循常規(guī)流。它就像是relative和fixed的合體，當(dāng)在屏幕中時(shí)按常規(guī)流排版，當(dāng)卷動(dòng)到屏幕外時(shí)則表現(xiàn)如fixed。該屬性的表現(xiàn)是現(xiàn)實(shí)中你見(jiàn)到的吸附效果。（CSS3）
* CSS3新增屬性可能存在描述錯(cuò)誤及變更，僅供參考，持續(xù)更新
說(shuō)明：
檢索對(duì)象的定位方式。
當(dāng)position的值為非static時(shí)，其層疊級(jí)別通過(guò)z-index屬性定義。
絕對(duì)定位的元素，在top，right，bottom，left屬性未設(shè)置時(shí)，會(huì)緊隨在其前面的兄弟元素之后，但在位置上不影響常規(guī)流中的任何元素。用這個(gè)特性你或許會(huì)干這樣的事：demo
對(duì)應(yīng)的腳本特性為position。
兼容性：
IE如果在 quirks mode下將不支持；
Firefox30.0開(kāi)始支持 tr, thead, tfoot, tbody 定義 relative，F(xiàn)irefox30.0之前的版本及其它瀏覽器都只能給 table 定義 relative 用以約束內(nèi)部元素的定位；
需要定義了<meta name="viewport" content="width=device-width, user-scalable=no">才生效
示例：
實(shí)例
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<meta charset="utf-8" />
<title>position_CSS參考手冊(cè)_web前端開(kāi)發(fā)參考手冊(cè)</title>
<meta name="author" content="Joy Du(飄零霧雨), dooyoe@gmail.com, www.doyoe.com" />
<style>
#position {
position: absolute;
top: 50%;
left: 50%;
width: 150px;
height: 40px;
margin: -20px 0 0 -75px;
padding: 0 10px;
background: #eee;
line-height: 2.4;
}
</style>
</head>
<body>
<div id="position">水平垂直居中的對(duì)象</div>
</body>
</html>運(yùn)行實(shí)例 ?
點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例