水平和垂直居中是面试的常见部分。今天，我将一步步分析如何去做。以前感觉有点死记硬背，并没有真正整理出来。我们先来看一下整个实现过程的图。1.whenleft:50%如图12,whentop:50%如图23,为了呈现如图3所示的情况,有两种实现方案(1)方案1是当width和目标对象的高度是已知的，你可以设置margin-left:-width/2margin-top:-height/2。(2)对于方案2，如果目标物体的宽高未知，使用transform:translate(-50%.-50%)。为什么用这个设置可以实现translate(-50%.-50%)？因为translation(x,y,z)移动是相对于自身的中心位置偏移的，如图2中可以看出，目标物体的中心位置恰好与视图中??心位置x,y相差-50%*目标对象的宽度或高度，因此可以实现此方法。下面是对实施步骤和过程翻译的进一步解释。
