css的3種定位

標籤：視圖   文檔流   瀏覽器   元素   relative   abs   空間   位移   pos   

1.固定定位(position:fixed;)

   固定定位使用fixed屬性,他會相對於整個文檔定位，我們可以輕鬆的讓一個元素定位在瀏覽器上，使元素在螢幕上保持固定，下拉捲軸，位置也不改變。

　注意：固定定位的元素會始終位於瀏覽器視窗內視圖的某個位置，不會受文檔流動影響.

2.相對定位(position:relative;)

   如果想讓一個元素在他本來的位置進行調整(位移)，我們可以將該元素定位設定為relative，同時指定相對位移(利用top,bottom,left,right)。

   注意：相對定位的元素仍然在文檔流中，仍然佔據著他本來佔據的位置空間。

 3.絕對位置（position:absolute;)

    如果想讓一個元素在文檔制定位置，需要設定position:absolute(表示絕對位置)，這條語句的作用將元素從文檔流中拖出來，然後使用left、right、top、bottom屬性相對於其最接近的一個具有定位屬性的父包含塊進行絕對位置。如果不存在這樣的包含塊，則相對於body元素，即相對於瀏覽器視窗。

 注意：絕對位置會是元素從文檔流中被刪除，不佔據空間。

    　　

css的3種定位