问答详情
源自：15-4 面试常考题之宽高不定实现盒子水平垂直居中

子块不知道宽高居中

 .subDiv{
     transform: translate(-50%, -50%); /* 先上左移动50%，这里50%是子块自身标准 */
     position:absolute;
     top:50%;        /* 在通过绝对定位下右50%居中，这里50%是父块标准 */
     left:50%;
 }
/*  可以这样理解吗？*/


提问者：自驱动 2020-10-24 23:43

个回答

  • qq_慕标6511493
    2020-10-25 00:27:59

    是的。

    transform: translate(-50%, -50%),这里表达的是已经绝对定位（相对于父块是相对定位）的子块左上角的点为父块的正中心值减去自身宽高的一半。

    0