CSS-居中技巧

  #首先自己要有宽度
  .container {
            width: 1000px;
            margin: 0 auto;
        }

    position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;

   display: flex;
            justify-content: center;
            align-items: center;

给父元素添加 position: relative;相对定位。
给自身元素添加position: absolute;绝对定位。
top: 50%;使自身元素距离上方“父元素的50%高度”的高度。
left: 50%;使自身元素距离上方“父元素的50%宽度”的宽度。
transform: translate(-50%,-50%);使自身元素再往左，往上平移自身元素的50%宽度和高度


    position: absolute;
             top: 50%;
             left: 50%;
             transform: translate(-50%,-50%);