學習日誌

position屬性有四個屬性值可以設定，分別是static, relative, absolute, fixed。

static(靜態定位)：

為預設值，表示區塊保持在原本應該在的位置上，即該值沒有任何移動的效果。

relative(相對定位)：

使用相對定位，除了將position屬性設置為relative之外，還需要指定一定的偏移量，水平方向透過left或right屬性來指定，垂直方向透過top和bottom來指定。

• 定位原則：
  
  • 使用相對定位的盒子，會相對於它在原本的位置，透過偏移指定的距離，到達新的位置。
  • 使用相對定位的盒子仍在標準串流中，它對父區塊和兄弟盒子沒有任何影響。

absolute(絕對定位)：

• 使用絕對定位的盒子以它的「最近」── 父親比祖父近、祖父比曾祖父近 ── 的一個「已經定位」── position屬性被設置，且被設置為不是static的任一種方式 ── 的「父項目」為基準偏移。如果沒有已經定位的父項目，那麼會以瀏覽器視窗為基準進行定位。
• 絕對定位的框從標準串流中脫離，這意味著它們對其後的兄弟盒子的定位沒有影響，其他的盒子就當這個盒子不存在一樣。

fixed(固定定位)：

和absolute有些類似，但定位的基準不是父項目，而是瀏覽器視窗或其它顯示裝置的視窗。

z-index空間位置：

z-index屬性用於調整定位時重疊區塊的上下位置，想像頁面為x-y軸，垂直頁面的方向為z軸，z-index值大的頁面位於值小的頁面的上方。

z-index屬性可以是正數也可以是負數，默認的z-index值為0。