說明:如果您有任何疑問或想咨詢其他業(yè)務(wù)請撥打電話 400 685 0732
全網(wǎng)監(jiān)測海量數(shù)據(jù)按需發(fā)布監(jiān)測預(yù)警
實時把握輿情動態(tài)精準(zhǔn)追溯信息源頭
position其實就是用來設(shè)定元素的定位類型,在使用過程當(dāng)中一共有四個常見的屬性值,分別是static,relative,absolute,fixed,這四種屬性究竟有哪些特點呢?接下來我們就一起來好好的了解一下吧。
position屬性——css中定位position有哪幾個屬性值
1、static,默認(rèn)值
說到這里我們不得不提一下一個定義——文檔流,很多書對文檔流這個概念只是一筆帶過,沒有詳細解答,但我根據(jù)自己的經(jīng)驗和理解對它進行了總結(jié),文檔流其實就是文檔的輸出順序,也就是我們通??吹降挠勺蟮接?、由上而下的輸出形式,在網(wǎng)頁中每個元素都是按照這個順序進行排序和顯示的,而float和position兩個屬性可以將元素從文檔流脫離出來顯示。
默認(rèn)值就是讓元素繼續(xù)按照文檔流顯示,不作出任何改變。
2、relative,相對定位
相對定位一個最大特點是:自己通過定位跑開了還占用著原來的位置,不會讓給他周圍的諸如文本流之類的對象。相對定位也比較獨立,做什么事它自己說了算,要定位的時候,它是以自己本身所在位置偏移的(相對對象本身偏移)。本身位置變化了,而元素最初所占的物理空間依然還是存在,另外一點元素相對定位后并沒有影響其他相鄰的元素。
3、absolute,絕對定位
位置被設(shè)置為absolute后,被設(shè)置的元素會被定義到包含它的元素內(nèi)的指定坐標(biāo)(X坐標(biāo)、Y坐標(biāo))。
比如:position:absolute;left:20px;top:80px;這個容器始終位于距離瀏覽器左20px,距離瀏覽器上80px的這個位置。它不會隨著窗口大小變化,只是固定在一個特定的坐標(biāo)軸上面;
4、固定位置,fixed
在理論上,被設(shè)置為fixed的元素會被定位于瀏覽器窗口的一個指定坐標(biāo),不論窗口是否滾動,它都會固定在這個位置。但是目前它在IE6中不被支持.
CSS中Position的用法詳解
position:static|relative|absolute|fixed
取值:
static:默認(rèn)值,無特殊定位,對象遵循正常文檔流。top,right,bottom,left等屬性不會被應(yīng)用,默認(rèn)值。
relative:相對定位,對象遵循正常文檔流,但將依據(jù)top,right,bottom,left等屬性在正常文檔流中偏移位置。
absolute:絕對定位,對象脫離正常文檔流,使用top,right,bottom,left等屬性進行絕對定位。而其層疊通過z-index屬性定義。
fixed:固定定位,對象脫離正常文檔流,使用top,right,bottom,left等屬性以窗口為參考點進行定位,當(dāng)出現(xiàn)滾動條時,對象不會隨著滾動。
以上就是有關(guān)position屬性的所有內(nèi)容,當(dāng)然了解了position屬性之后還不夠,要想正確的使用是一定要認(rèn)真的去琢磨其中的使用技巧的,如果還想了解更多與之有關(guān)的內(nèi)容,歡迎關(guān)注我們文軍營銷的官網(wǎng)。
推薦閱讀
說明:如果您有任何疑問或想咨詢其他業(yè)務(wù)請撥打電話 400 685 0732