淺談 css 之 position用法

在 css中, position 屬性有四個值可用: static(默認值)、absolute、relative、fixed。

relative:相對定位(相對於自身進行在常規流中的位置進行定位，保留自身原始的位置)

absolite:

1、相對於自身的包含塊定位；

2、尋找包含塊的規則：從自身網上尋找祖先元素，尋找到的第一個position為非static修飾的祖先元 素的內邊距邊界 就是當前絕對定位元素的包含塊；如果沒有的話，則相對於 html進行定位；

3、完全脫離文檔流；

4、display的取值更改為inline-block；

5、不縮短行框

fixed:

完全脫離文檔流，和 absolute 的唯一的區別就在於：absolute元素是根據最近的定位上下文確定位置，而fixed永遠根據瀏覽器確定位置。即使窗口是滾動的它也不會移動

說到 position，就要再說一下 [Z-index] (垂直定位)

Z-index 默認值為0；這種情況下，後者會覆蓋前者，需要改變元素之間層級關係的話，就要通過改變 Z-index 值來實現了，Z-index值越大優先順序就越高。

更多優質內容推薦：

2017優就業就業促進計劃：

http://www.ujiuye.com/zt/jycj/?wt.bd=fq37300s

學IT，用周末給自己加薪!

http://www.ujiuye.com/zt/zmb/?wt.bd=fq37300s

IT職業教育：http://xue.ujiuye.com/

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！