position定位： static/absolute/raletive/fixed/sticky

1)static是position屬性的默認(rèn)值。如果省略position屬性，瀏覽器就認(rèn)為該元素是static定位

2)relative、absolute、fixed這三個(gè)屬性值有一個(gè)共同點(diǎn)，都是相對(duì)于某個(gè)基點(diǎn)的定位，不同之處僅僅在于基點(diǎn)不同;另外都必須搭配top、bottom、left、right這四個(gè)屬性中的兩個(gè)使用(top和bottom二選一，left和right二選一)

???????? a.relative相對(duì)于默認(rèn)位置（即static時(shí)的位置）進(jìn)行偏移

???????? b.absolute 脫離原來(lái)位置進(jìn)行定位，最近的有定位的父級(jí)，就進(jìn)行定位；如果沒(méi)有，那么相對(duì)于文檔進(jìn)行定位

???????? c.fixed相對(duì)于視口（瀏覽器窗口）進(jìn)行偏移，即定位基點(diǎn)是瀏覽器窗口。這會(huì)導(dǎo)致元素的位置不隨頁(yè)面滾動(dòng)而變化，好像固定在網(wǎng)頁(yè)上一樣

3)sticky跟前面四個(gè)屬性值都不一樣，它會(huì)產(chǎn)生動(dòng)態(tài)效果，很像relative和fixed的結(jié)合：一些時(shí)候是relative定位（定位基點(diǎn)是自身默認(rèn)位置），另一些時(shí)候自動(dòng)變成fixed定位（定位基點(diǎn)是視口）,頁(yè)面向下滾動(dòng)時(shí)，工具欄變成固定位置，始終停留在頁(yè)面頭部（fixed定位）,等到頁(yè)面重新向上滾動(dòng)回到原位，工具欄也會(huì)回到默認(rèn)位置;sticky生效的前提是，也是必須搭配top、bottom、left、right這四個(gè)屬性中的兩個(gè)一起使用

此處以經(jīng)典五環(huán)為例：