因為relative相對定位是相對原位置的移動,不占用偏移出來的位置.我自己用兩個方法:

1. 給需要定位的套個大的div，div用margin來調整位置.

2. 后面的元素margin-top=相對定位的top來解決.

css選擇器優先級核心：每個選擇器本身有優先級，作用范圍越具體優先級越高。

CSS優先級從高到低分別是：

1.在屬性后面使用 !important 會覆蓋頁面內任何位置定義的元素樣式。

2.作為style屬性寫在元素標簽上的內聯樣式

3.id選擇器

4.類選擇器

5.偽類選擇器

6.屬性選擇器

7.標簽選擇器

8.通配符選擇器

9.瀏覽器選擇器

當CSS樣式的規則由多個選擇器組成時，id選擇器的權值為1000，class選擇器為100，標簽選擇器為10，按權值求和的記過高低決定哪個優先。當兩個css規則的權值相同時，誰更具體用誰，也就是權值高的選擇器作用的越具體優先級越高。當兩個選擇器規則和權值都是一樣，后面樣式會覆蓋前面的！

1、position:absolute; 生成絕對定位的元素，相對于 static 定位以外的第一個父元素進行定位。

2、position:fixed; 生成絕對定位的元素，相對于瀏覽器窗口進行定位。

3、 position:relative; 生成相對定位的元素，相對于其正常位置進行定位。

4、position:static; 默認值。沒有定位，元素出現在正常的流中（忽略 top, bottom, left, right 或者 z-index 聲明）。

5、position:inherit; 規定應該從父元素繼承 position 屬性的值。

在css樣式中，星號代表的是“所有元素”，“*”選擇器能夠選取所有的元素或者一個元素中的所有子元素。使用“*”選擇器來設置樣式，會統一設置所有元素的樣式，語法為“*{css屬性:屬性值;}”。

星號選擇器（*）表示選中所有的元素。

* 選擇器選取所有元素。

* 選擇器也能選取另一個元素中的所有元素。

注意：*選擇器比較消耗性能，盡量避免使用，應使用更加精確的選擇器選擇元素。