css垂直居中两种最简单方法

一、使用transform: translateY

.modal .content{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 55rpx;
    right: 55rpx;
    width: 640rpx;
    height: 272rpx;
    background-color: #fff;
    z-index: 1111;
    border-radius: 16rpx;
}

 

二、使用margin：auto

.modal .content{
    position: absolute;
    width: 200rpx;
    height: 200rpx;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}