position：static(靜態定位)

當position屬性定義為static時，可以將元素定義為靜態位置，所謂靜態位置就是各個元素在HTML文檔流中應有的位置

podisition定位問題。所以當沒有定義position屬性時，并不說明該元素沒有自己的位置，它會遵循默認顯示為靜態位置，在靜態定位狀態下無法通過坐標值（top,left,right,bottom）來改變它的位置。

position：absolute(絕對定位)

當position屬性定義為absolute時，元素會脫離文檔流，完全不受文檔流的影響，根據某個參照物坐標來定位它的位置.當絕對定位元素沒有顯示的指明top,right,bottom,left定位屬性時，它還是暫時未脫離文檔流，并受文檔流的影響，具有相對定位的特性，但是它在文檔流中的位置已經不存在了。如果絕對定位只顯示的定位x軸或者Y軸，那它只具備這個方向上的定位能力，另一個方向仍然顯示為相對定位的特性。

坐標值：
top:表示定位元素頂邊外壁到參照物元素頂部內壁的距離
right:表示定位元素右邊外壁到參照物元素右側內壁的距離
left:表示定位元素左邊外壁到參照物元素左側內壁的距離
bottom:表示定位元素底邊外壁到參照物元素底部內壁的距離

XML/HTML Code復制內容到剪貼板

<div id="box">box                                                             
  <div id="boxA">boxA</div>     
  <div id="boxB">boxB   
   <div id="boxC">boxC</div>  
   <div id="boxD">boxD</div>  
  </div>  
 </div>  

CSS Code復制內容到剪貼板

#box{   
 margin:40px auto;   
 width:400px;   
 height:400px;   
 border:2px red solid;   
}   
#boxA{   
 position:absolute;   
 top:100px;   
 left:100px;   
 width:50px;   
 height:50px;   
 background: #3E7DB0;   
}  

大盒子box在整個網頁中距頂部40px居中顯示，但是boxA由于position定位為絕對定位，它脫離了大盒子，距整個網頁左邊100px頂部100px，當元素定義為絕對定位，可以根據結合它的坐標屬性（top,left,bottom,right）來精確定位它的位置