div垂直居中的一些方法css

方法一

知道div宽高的情况下:
div{
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -divWidth50%;
    margin-top: -divheight50%;
}

方法二:

不知道宽高,flex流体布局:
divParent{
    display: flex;
    justify-content: center;
    align-items: center;
}

方法三

不知道宽高,固定定位:
div{
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 9;
    transform: translateX(-50%) translateY(-50%);
}

你可能感兴趣的:(div垂直居中的一些方法css)