本節簡介:固定定位,相對定位和絕對定位的對比及代碼編寫方式等。
本節課同學們做的筆記 點擊播放按鈕可自動定位到對應時間進行播放
position:fixed(固定定位原有的位置不在了)relative(相對定位,相對自己定位)absolute(絕對定位,根據父級位置進行定位)left值和top值是基于定位屬性的。沒有定位屬性就會失效。
position:absolute 原有位置不存在,父級必須要有定位屬性
相對定位:position:relative 原有位置依舊存在
如果父集沒有變化的,用相對定位,有變化的,用絕對定位
z-index:1;默認為0 , 代表定位層級,數值越大,位置越上面
z-index:1;默認為0 , 代表定位層級,數值越大,位置越上面
position:absolute;絕對定位,需要父級是relative定位,原有位置不存在,
position:relative;相對定位,相對原有位置移動,原有位置依然存在
position:fixed;固定定位,原有位置不存在
position:fixed; left:50%; top:50%; margin-top:-div高度的一半; margin-left:-div寬度的一半; 就可以使div固定在屏幕中間
position:fixed是固定; top:100px意思是距離頂部100px; right:0意思是貼著右側;