1溫故知新
.absolute：生成絕對定位的元素，相對於除position:static 定位以外的第一個有定位屬性的父元素進行定位，若父元素沒有定位屬性則相對於瀏覽器窗口的左上角定位，定位的元素不再占據文檔的空間。
relative：生成相對定位的元素，相對於其正常位置進行定位,定位的元素仍然占據文檔的空間。
2.發現問題
首先看一個代碼：a為父元素，b為子元素；
<div class="a">
a
<div class="b">b</div>
</div>
現在給b加上絕對定位屬性，父元素不加定位屬性，那么b會相對於瀏覽器窗口的左上角定位；
一切如上面提到的那樣，b元素相對於瀏覽器定位，但如果將a元素加上transform屬性，那么結果就會發生改變！！
很奇怪，b元素竟然跑到a元素里面，並且相對於a元素定位了，這種情況是不是非常熟悉，就好像給a元素增加了一個定位屬性；那么增加的這個定位屬性的值是relative還是absolute呢？
我們新增加一個元素c，看看效果。
<div class="a">
a
<div class="b">b</div>
</div>
<div class="c">c</div>
發現沒有，c元素並沒有忽略掉a，也就是說a仍然占據着原有的位置，所有在給a元素加上transform屬性之后,a元素具有類似relative的特性，那么既然具有relative特性，如果給a直接加上定位的數值會怎樣呢？
可以看出，a的位置並沒有發生任何改變，所以只能說加了transfrom屬性的a標簽只是具有類似relative的特性，那么此時a標簽的層疊性如何呢？？我們回到最初的情況（a元素沒有transform屬性，b元素設置絕對定位），此時給c元素的margin-top加一個負值，使c元素向上運動，覆蓋a元素，如下所示：
倘若此時，給a元素加上transform屬性，那么a元素的垂直地位就會發生改變，而且b元素定位參照的對象也會從瀏覽器窗口改成a元素。
3.總結
當給一個元素加上transform屬性的時候，這個元素就會具有relative的特性,所以若一個元素的父元素擁有tranform屬性，那么子元素在使用定位屬性的時候要注意。
4.結束語
這個問題是昨天做項目的時候偶然發現的，所有今天就研究了一下，寫的第一篇文章肯定有很多地方寫的不好，所以還請大家取其精華去其糟粕。