问答详情
源自:15-3 面试常考题之已知宽高实现盒子水平垂直居中

已知宽高设置垂直居中

设置margin-top为 其负的高度的一半是什么意思,不理解

提问者:慕数据5185880 2021-07-03 23:30

个回答

  • qq_慕移动2452305
    2021-07-06 14:55:29

    因为在网页中元素的默认定位都是在左上角,所以当为某元素设置 margin-top: 50%; 之后,并不代表该元素的位置在相对元素的y坐标居中对齐,还要向上偏移自身高度的一半。

    http://img.mukewang.com/60e3fe5a00012cbf03400269.jpg

    http://img1.mukewang.com/60e3fe5a0001485403530392.jpg

    http://img.mukewang.com/60e3fe5b0001eb3803020346.jpg

     

  • qq_慕仰6185802
    2021-07-06 14:31:53

    自身高度是一百,则负的高度的一半则是-50所以margin-top:-50px;