flex布局，数据列展示，并居中，页面缩放样式错乱

元素居中，margin后面如果只有两个参数的话，第一个表示top和bottom，第二个表示left和right

因为0 auto，表示上下边界为0，左右则根据宽度自适应相同值（即居中）

.body {
    box-sizing: border-box;
    width: 100%;
    max-width: 1140px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    background-color: #FFF;
    flex-direction: column;
}

页面缩放时，样式错乱了，解决方案是我在最外层包了一层div，样式的话就是上面.body,我所理解的是，在外面用容器包裹住，那么页面进行缩放 的时候就容器大小会整体改变，但是不会影响容器里面的样式。