position其實(shí)就是用來(lái)設(shè)定元素的定位類型，在使用過(guò)程當(dāng)中一共有四個(gè)常見(jiàn)的屬性值，分別是static，relative，absolute，fixed，這四種屬性究竟有哪些特點(diǎn)呢?接下來(lái)我們就一起來(lái)好好的了解一下吧。

　　position屬性——css中定位position有哪幾個(gè)屬性值

1、static，默認(rèn)值

說(shuō)到這里我們不得不提一下一個(gè)定義——文檔流，很多書(shū)對(duì)文檔流這個(gè)概念只是一筆帶過(guò)，沒(méi)有詳細(xì)解答，但我根據(jù)自己的經(jīng)驗(yàn)和理解對(duì)它進(jìn)行了總結(jié)，文檔流其實(shí)就是文檔的輸出順序，也就是我們通?？吹降挠勺蟮接摇⒂缮隙碌妮敵鲂问?，在網(wǎng)頁(yè)中每個(gè)元素都是按照這個(gè)順序進(jìn)行排序和顯示的，而float和position兩個(gè)屬性可以將元素從文檔流脫離出來(lái)顯示。

默認(rèn)值就是讓元素繼續(xù)按照文檔流顯示，不作出任何改變。

2、relative，相對(duì)定位

相對(duì)定位一個(gè)最大特點(diǎn)是：自己通過(guò)定位跑開(kāi)了還占用著原來(lái)的位置，不會(huì)讓給他周?chē)闹T如文本流之類的對(duì)象。相對(duì)定位也比較獨(dú)立，做什么事它自己說(shuō)了算，要定位的時(shí)候，它是以自己本身所在位置偏移的(相對(duì)對(duì)象本身偏移)。本身位置變化了，而元素最初所占的物理空間依然還是存在，另外一點(diǎn)元素相對(duì)定位后并沒(méi)有影響其他相鄰的元素。

3、absolute，絕對(duì)定位

位置被設(shè)置為absolute后，被設(shè)置的元素會(huì)被定義到包含它的元素內(nèi)的指定坐標(biāo)(X坐標(biāo)、Y坐標(biāo))。

比如：position：absolute;left:20px;top:80px;這個(gè)容器始終位于距離瀏覽器左20px,距離瀏覽器上80px的這個(gè)位置。它不會(huì)隨著窗口大小變化，只是固定在一個(gè)特定的坐標(biāo)軸上面;

4、固定位置，fixed

在理論上，被設(shè)置為fixed的元素會(huì)被定位于瀏覽器窗口的一個(gè)指定坐標(biāo)，不論窗口是否滾動(dòng)，它都會(huì)固定在這個(gè)位置。但是目前它在IE6中不被支持.

　　CSS中Position的用法詳解

position：static|relative|absolute|fixed

取值:

static：默認(rèn)值，無(wú)特殊定位，對(duì)象遵循正常文檔流。top，right，bottom，left等屬性不會(huì)被應(yīng)用，默認(rèn)值。

relative：相對(duì)定位，對(duì)象遵循正常文檔流，但將依據(jù)top，right，bottom，left等屬性在正常文檔流中偏移位置。

absolute：絕對(duì)定位，對(duì)象脫離正常文檔流，使用top，right，bottom，left等屬性進(jìn)行絕對(duì)定位。而其層疊通過(guò)z-index屬性定義。

fixed：固定定位，對(duì)象脫離正常文檔流，使用top，right，bottom，left等屬性以窗口為參考點(diǎn)進(jìn)行定位，當(dāng)出現(xiàn)滾動(dòng)條時(shí)，對(duì)象不會(huì)隨著滾動(dòng)。

以上就是有關(guān)position屬性的所有內(nèi)容，當(dāng)然了解了position屬性之后還不夠，要想正確的使用是一定要認(rèn)真的去琢磨其中的使用技巧的，如果還想了解更多與之有關(guān)的內(nèi)容，歡迎關(guān)注我們文軍營(yíng)銷的官網(wǎng)。

推薦閱讀