絕對定位和固定定位

絕對定位

定位：基於***定位，上下左右~

沒有父級元素定位的前提下，相對於瀏覽器定位

假設父級元素存在定位，我們通常會相對於父級元素進行偏移

在父級元素範圍內移動

相對於父級或瀏覽器的位置，進行指定的偏移，絕對定位的話，它不在標準文件流中，原來的位置不會被保留

lang
="en"
>
>
charset
="utf-8"
>
>
titletitle
>
>
div#father
#first
#second
#third
style
>
head
>
>
"father"
>
"first"
>
第乙個盒子div
>
"second"
>
第二個盒子div
>
"third"
>
第三個盒子div
>
div>
body
>
html
>

lang
="en"
>
>
charset
="utf-8"
>
>
titletitle
>
>
body
div:nth-of-type(1)
div:nth-of-type(2)
style
>
head
>
>
>
div1div
>
>
div2div
>
body
>
html
>

相對定位，絕對定位和固定定位

1.脫標，但是保留原來位置 下面的盒子上不來，也可以說是半脫標 2.偏移從以自己標準流中的位置為原點 1.完全脫標，不保留原來位置 2.父元素沒有定位的情況，子盒子以當前螢幕為基準點進行移動 3.父元素有定位 相對，固定，絕對 的情況，子盒子以父元素 有定位的最近祖元素 為基準點進行移動 body ...

相對定位，絕對定位和固定定位

相對定位 relative 是相對於自己原本的位置進行偏移，但他仍在標準文件流中，且偏移前的位置會被保留 html lang en id father id first 第乙個盒子 id second 第二個盒子 第三個盒子 效果如下 向右偏移 left 20 px 向上偏移 top 20px 效果...

相對定位 絕對定位 固定定位

設定position屬性值為static的元素是乙個靜態定位元素，此值為預設值，即此元素在正常文件流中。設定position屬性為relative的元素是乙個相對定位元素，其定位的參照物為元素本身 即元素原本的位置進行定位 例項 parent child style class parent cla...