css 绝对定位实现水平垂直居中

负margin实现水平垂直居中

    width: 500px;
    height: 500px;
    position: absolute;
    left: 50%;
    top :50%;
    margin-left: -250px;  
    margin-top: -250px;

css3 translate 实现水平垂直居中

    width: 600px;
    height: 600px;
    position: absolute;
    left: 50%;
    top : 50%;
    transform: translate(-50%,-50%);

margin : auto实现水平垂直居中

    width: 650px;
    height: 650px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;

原文:小tip: margin:auto实现绝对定位元素的水平垂直居中

猜你喜欢

转载自www.cnblogs.com/rosendolu/p/10570249.html