教育行業(yè)A股IPO第一股（股票代碼 003032）

全國咨詢/投訴熱線：400-618-4000

position的屬性值有哪些？分別有哪些作用？

更新時間:2021年09月24日16時25分 來源:傳智教育 瀏覽次數(shù):

好口碑IT培訓(xùn)

position的屬性值有哪些？分別有哪些作用？

1.static：默認(rèn)值

靜態(tài)定位是元素的默認(rèn)定位方式，即無定位的意思，不脫離文檔流，top，right，bottom，left等屬性不生效，靜態(tài)定位在布局時我們幾乎不用。


2.相對定位：relative

參照物：元素本身偏移前位置

注：設(shè)置了相對定位，左右margin為auto仍然有效，原來在標(biāo)準(zhǔn)流的區(qū)域繼續(xù)占有，后面的盒子仍然以標(biāo)準(zhǔn)流的方式對待它。并且不會脫離文檔流。


3.絕對定位：absolute

絕對定位是元素以帶有定位的父級元素來移動位置，要成為絕對定位元素的參照物必須滿足以下兩個條件：

·參照物和絕對定位元素必須是包含與被包含關(guān)系;

·該參照物必須具有定位屬性;

如果找不到滿足以上兩個條件的父包含塊，那么相對于瀏覽器窗口進(jìn)行定位

注：設(shè)置了position: absolute;屬性后，元素會脫離正常文檔流，不在占據(jù)空間;左右margin為auto將會失效;我們通過left、top、bottom、right來決定元素位置


4.固定定位：fixed

參照物：瀏覽器窗口;

注：固定定位會脫離文檔流;當(dāng)絕對定位和固定定位參照物都是瀏覽器窗口時的區(qū)別： 當(dāng)出現(xiàn)滾動條時，固定定位的元素不會跟隨滾動條滾動，絕對定位會跟隨滾動條滾動。



猜你喜歡：

css定位詳解：css中定位類型

什么是CSS浮動?有什么作用？

如何用css畫圓?

CSS3如何設(shè)置顏色不透明度？

傳智教育HTML&JS+前端高手班

0 分享到：
和我們在線交談！