1. 程式人生 > >關於頁面元素的絕對定位和相對定位

關於頁面元素的絕對定位和相對定位

從今天開始要經常性的把一些小知識點整理一下了,可能有些很簡單,不過應該是都能用得到的。

關於div的絕對定位和相對定位,這個是每一個搞前端的IT人員都會用到的,所謂絕對定位,就是這個東西就是在那裡了,不管其他東西怎麼動,我的位置不變,這個說好聽點叫有氣節,說不好聽了叫耍無賴。當然一般使用絕對定位都是為了相對定位用的。這個就類似於黑幫收保護費,這一片歸我管,那我裡面的元素位置都是想對我而言的,和外界沒有關係。說完絕對定位,來說一下相對定位,含有這個屬性的元素就很沒氣節了,領導去哪我去哪,永遠圍著領導轉。恩恩,扯這麼多言歸正傳。

有些時候,我們需要在一個圖層上面加點東西,但是在web頁面裡面不能像ps裡面這麼方便的新增。我們需要寫一個div(或者其他容器)來存放我們這個圖層裡面的東西,然後把它放到我們想要放置的圖層(div)內,將我們父層的style屬性內的position設為absolute,最後將我們新建的div的style的position設為relative。這樣我的層就會置於父層之上了。子層會有top bottom left right屬性,通過上下左右我們可以定位我們的元素了。

有一點需要注意,如果你沒有定義一個絕對定位層,那麼你的相對定位就是相對整個頁面而言的,一個大家常用的原型設計軟體Axure RP就是全域性的相對定位。其實Axure RP挺好用的。

天氣轉涼了,注意保暖。