1.先把父元素display:flex
2.在父元素设置justify-content:center;水平居中
3.在父元素设置align-items:center;垂直居中
align-items 属性定义flex子项在flex容器的当前行的侧轴（纵轴）方向上的对齐方式。
justify-content 用于设置或检索flex元素在主轴（横轴）方向上的对齐方式。
flex-direction ：row | row-reverse | column | column-reverse direction属性决定主轴的方向（即项目的排列方向）。
flex 主轴是哪个就定义哪个的长度，会覆盖width和height