1.相對定位 相對於元素自身的偏移
position: relative;relative宣告了之後，在下方宣告四個方向的位置偏移量top: 20px;
left: -50px;
這裡注意方向 相對於原來的top有了20px的距離，相對於原來的left有了-50px的距離，因此元素是向下和向左移動
雖然元素會出現偏移出父級元素的情況，但這並不是浮動，父級元素仍然保留有其原來的位置
2.絕對定位
position: absolute;與父級元素完全無關，相對於瀏覽器進行定位
當父級元素擁有相對定位時，絕對定位會相對於父級元素進行定位
3.固定定位
position: fixed;相對於瀏覽器位置不會改變，頁面改動，元素位置也不會改變
4.z-index
首先要有圖層的概念
這裡舉例：頁面實現如下效果
最底下是img 然後乙個背景為黑色的空div，然後是乙個text，此時的顯示介面如圖，但當在空的黑色div使用了
.block後頁面：
此時空div的圖層優先順序比text高所以優先展示，z-index從0開始越大優先順序越高，反之亦是如此；
css粘性定位sticky的使用
在做h5頁面的過程中，經常會遇到這種情況，頁面滾動到一定位置的時候，那個元素需要固定在頂部，之前都是用js去計算再實現，其實用css來實現更加方便 html div p 粘性定位 p div css div p 頁面滾動到div的位置的時候，p元素就會浮動固定在頂部，超出div就不浮動了。實際專案中...
CSS定位position使用介紹
一 定義 設定元素的偏移效果，一般配合left top right bottom屬性共同作用，用於元素定位。二 position 屬性值介紹 說明 1 文件流 元素未定位前 偏移前 的原本所佔的空間仍保留 非文件流 元素未定位前 未偏移前 的原本所佔的空間由後面元素填充，被其占用。2 相對元素 作為...
CSS定位使用方法
對於網頁頁面布局來說，使用定位進行布局十分的方便。絕對定位 使用絕對定位應當將父元素設定為相對定位，否則元素絕對定位的基準會一直尋找外層非靜態定位元素 doctype html html lang en head meta charset utf 8 title title title style ...