絕對定位使用margin:0 auto居中

Li-Jiacong發表於2018-10-25

先上結論:只要對立方位的屬性值同時存在時即可

position: absolute;
left: 0;	/*不一定要0,存在即可*/
right: 0;	/*不一定要0,存在即可*/
margin: 0 auto;
width: 		/*該多少就多少*/

格式化寬度:格式化寬度僅出現在“絕對定位模型中”,也就是出現在position屬性值為absolutefixed的元素中。對於非替換元素,當left/righttop/bottom對立方位的屬性值同時存在時,元素的寬度表現為“格式化寬度”,其寬度大小相對於最近的具有定位特性的祖先元素計算。“格式化寬度”具有完全的流動性,也就是marginborderpaddingcontent內容區域同樣會自動分配水平和垂直空間。
上面的內容源自張鑫旭大神的《CSS世界》(強烈推薦的一本書),剛好今天敲程式碼的時候有一個絕對定位居中的需求,回憶起來自己曾經在這本書看過相關內容,就順便記錄一下。

相關文章