垂直水平居中的几种实现方式

一.使用弹性盒模型 display: flex

     1. 在你不知道当前元素的宽高的情况下 你可以为父元素设置 display: flex;样式 并设置 align-items: center； justify-content: center

  

2. 还有种情况就是你知道为元素设置position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); 这个百分之五十是相对于元素自身宽度的一半