postion relative 對 absolute 和 fixed 的限制做用

若是 一個 元素 定位了 absolute ， 若是 它的父元素 定位了 relative 那麼 該元素的定位會被限制

absolute

1， 限制 left ， top , right , bottom , 在 父元素裏面 進行 定位。

2， 限制 z-index 層級， 子元素層級和父元素層級同樣

3， 限制 在 overflow ， 若是 沒有父元素 定位 absolute 那麼 子元素 overflow 會沒有其做用的， 會露出來 超出的部份內容。 若是父元素 加了 定位 relative 那麼子元素的 overflow 就能夠控制了

fixed的限制

只能限制 子元素的 z-index 層級， 和 父元素層級同樣。 其餘限制不了

https://www.imooc.com/video/10710

relative 定位和 absolute 定位

relative 定位是 相對 自身的， 也就是 relatIve的定位是 以 top=0 ,left=0 爲原點來定位的。 而 absolute 是 以 邊界的 四個角爲 原點進行定位的。

relative 無相關性

relative 定位，不會影響其餘元素的佈局和定位，不想 margin 定位，會影響其餘元素進行移動。

###儘可能避免使用 relative relative 有時候會出現BUG或者是 元素的層級覆蓋 absolute 不依賴於 relative ， 能夠使用其餘方式 好比 margin 去定位

###使用 relative 也要使用其最小化原則 即 若是某個元素須要定位， 能夠將 其 放入一個 空的 div 裏面， 該 div 定位爲 relative 而後該元素 能夠定位 爲 absolute ， 這樣就不會影響其餘元素了。