垂直水平对齐

我他喵的又没有写这个，我还以为我之前就写上来了呢。哭兮兮

垂直水平居中

1. 定位 + margin-top + margin-left

    .box {
      width: 1000px;
      height: 1000px;
      position: relative;
    }
    .son {
      position: absolute;
      top: 50%; 
      left: 50%;
      margin-top: -75px;
      margin-left: -50px;
      width: 100px;
      height: 150px;
    }

2. 定位 + margin

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

3. transform：存在兼容问题

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

4. flexbox方案：存在兼容问题

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

5. diplay: table-cell：让盒子内文字居中，不是块元素居中

      position: relative;
      display: table-cell;
      text-align: center;
      vertical-align: middle;