最接近的一個(gè)具有定位屬性的父包含塊
最接近的一個(gè)具有定位屬性的父包含塊;其中的定位屬性和父包含塊怎么理解？
SayHiTo
2016-02-21
5 回答
舉報(bào)
0/150
提交
取消
2016-03-30
一、所謂定位屬性：
CSS的語法是“元素：{屬性：值}”
具有定位屬性即該元素使用了position屬性，其實(shí)此屬性有四個(gè)值：
static靜態(tài)定位——即頁面流中元素默認(rèn)的位置
absolute絕對(duì)定位
relative相對(duì)定位
fixed固定定位
有圖為證，w3school的網(wǎng)站表述如下圖：
貌似扯多了。
二、父包含塊
此處的父包含塊貌似也可以稱作父元素，到底是下面哪一種意思呢？
單純指元素的上一層元素，姑且稱之為爸爸元素
包含元素的所有元素（爸爸元素、爺元素、太爺元素）
做了如下實(shí)驗(yàn)：
上圖中div3（小方框）的爸爸元素是不含定位屬性的div2（中方框），爺爺元素是含定位屬性的div1（大方框）。
如果父包含塊是單指爸爸元素，那么div3（小方框）應(yīng)該相對(duì)于body（頁面）定位，上邊界應(yīng)與div1（大方框平齊）。
然而并沒有，div3（小方框）最終以爺爺元素為準(zhǔn)進(jìn)行絕對(duì)定位。
最終判定父包含塊指包含該元素的所有元素，而實(shí)際上body元素從某種意義上講是所有元素（不考慮<html><head>）的父元素，當(dāng)所有元素都沒有定位屬性時(shí)只能以最外層的body為準(zhǔn)進(jìn)行定位了。
有點(diǎn)啰嗦，不知你是否理解。
2016-03-09
明白了
2016-03-09
什么是具有定位屬性的父包含塊？
2016-03-09
我也是這個(gè)問題，
2016-02-21
1、參照定位的元素必須是相對(duì)定位元素的前輩元素：
<div id="box1"><!--參照定位的元素-->
? ?<div id="box2">相對(duì)參照元素進(jìn)行定位</div><!--相對(duì)定位元素-->
</div>
從上面代碼可以看出box1是box2的父元素（父元素當(dāng)然也是前輩元素了）。
：使用position:absolute可以實(shí)現(xiàn)被設(shè)置元素相對(duì)于瀏覽器（body）設(shè)置定位