這一章節(jié)我們來學習已知寬高實現(xiàn)盒子水平垂直居中。通常使用定位完成,例如想要實現(xiàn)以下效果:
我們有如下兩個div元素

要實現(xiàn)子元素相對于父元素垂直水平居中,我們只需要輸入以下代碼:
技術(shù)點的解釋:
1、利用父元素設置相對定位,子元素設置絕對定位,那么子元素就是相對于父元素定位的特性。
2、子元素設置上和左偏移的值都為50%,是元素的左上角在父元素中心點的位置。效果:
3、然后再用margin給上和左都給負的自身寬高的一半,就能達到垂直水平居中的效果。
掌握已知寬高實現(xiàn)盒子水平垂直居中的用法,并自行實現(xiàn)一遍效果。
請驗證,完成請求
由于請求次數(shù)過多,請先驗證,完成再次請求
打開微信掃碼自動綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報