css中一共有五種定位：
position：static；預設值
position：absolute；絕對定位
position：relative；相對對定位
position：fixed；固定定位
position：sticky；粘性定位
其中，粘性定位是css3新增加的 相容性比較差
我們研究定位正常從三個方便研究，即文件流，移動位置的時候參照物，層疊順序。
a.position:static 定位的預設值，實際意義不大
b.position：absolute；絕對定位
1、文件流
脫離文件流 當乙個元素絕對定位之後，該元素是懸空的，下面的元素如果沒有定位則會上去，被覆蓋（全脫離）
浮動之後也是脫離文件流，但是浮動之後下面的容器會上去，裡面的文字會環繞顯示。（半脫離）
如果多個元素同時給了絕對定位，他們之間的層疊順序是，結構在後的元素在最上面。
2、移動位置的時候參照物
定位之後想要移動位置，可以用margin或者用
left top bottom right屬性移動位置
參照物1： 瀏覽器的第一屏
參照物2：是父元素 前提條件是有父元素且父元素有定位（可以是絕對、固定、相對）。
3、層疊順序（z-index必須有定位才可以用）
如果想要改變定位之後的層疊順序，可以通過乙個屬性 z-index屬性改變
z-index的預設值是0 不帶單位可以給負值
值越大，層越靠上 沒有最大值也沒有最小值
a1a2演示結果a3
c.position：relative；相對對定位
1、文件流
不脫離文件流，相對定位之後，該元素是佔瀏覽器位置
2、移動位置的時候參照物 只有1個
利用left right bottom top移動位置的時候
參照物是自己的初始位置 移動位置之後，原來的空間還在。
3、層疊順序
多個元素給完相對定位之後，如果沒有移動位置，那麼他們之間就不會覆蓋現象。
如果移動了位置，那麼後面的元素還是會覆蓋前面的元素。
可以通過z-index改變層疊順序
a1a2演示結果
d.position：fixed；固定定位
1、文件流
脫離文件流，但是該元素會固定在某個位置不動
2、用top left right bottom移動位置的時候參照物
參照物是瀏覽器的當前視窗
3、層疊順序
多個元素同時給了固定定位，結構上後面的元素會蓋在最上面
固定定位的層疊順序也可以用z-index改變
a1a2演示結果a3
（拖動滑鼠向下後的結果）
e.position：sticky；粘性定位
定位中的乙個特例，設定position:sticky同時給乙個(top,bottom,right,left)之一即可
其使用條件：
1、父元素不能overflow:hidden或者overflow:auto屬性。
2、必須指定top、bottom、left、right4個值之一，否則只會處於相對定位
3、父元素的高度不能低於sticky元素的高度
4、sticky元素僅在其父元素內生效
222222222222實際運用中，我們經常使用的定位是絕對定位和相對定位，他們可以一起使用，在乙個包含結構裡面，父元素給相對定位，子元素給絕對定位，這樣的話，子元素的參照物是父元素，父元素的參照物是自己的初始位置，就可以實現子元素覆蓋在父元素，也就是「子絕父相」。
css 4種定位方式
css的定位即position屬性的值有4種 static,relative,absolute,fixed。static是預設值，元素位於文件流中，正常顯示，忽略元素的top,bottom,left,right屬性。需要注意的一點是z index屬性在這個定位方式下始終為0.如果其他定位方式的漂浮元...
CSS的三種定位方式介紹
在css中一共有n種定位方式，其中，static relative,absolute三種方式是最基本最常用的三種定位方式。他們的基 本介紹如下。static預設定位方式 relative相對定位，相對於原來的位置，但是原來的位置仍然保留 absolute定位，相對於最近的非標準劉定位，原來的位置消失...
CSS的三種定位方式介紹
在css中一共有n種定位方式，其中，static relative,absolute三種方式是最基本最常用的三種定位方式。他們的基 本介紹如下。static預設定位方式 relative相對定位，相對於原來的位置，但是原來的位置仍然保留 absolute定位，相對於最近的非標準劉定位，原來的位置消失...