怎么让子元素在父元素中水平垂直居中

第一种方法:使用绝对定位

此方法要求父元素要有高度,父元素开启相对定位,子元素开启绝对定位.
注意:如果父元素没有高度也没有开启相对定位,则子元素会相对于body水平垂直居中.

第二种方法:使用flex布局

在flex布局中父元素是子元素的容器,子元素是父元素的项目.
容器里设置的属性都是对于项目来说的,
display:flex代表容器里的所有项目按flex布局,
justify-content:center:容器里的所有项目水平居中,
align-items:容器里的所有项目垂直居中,
这里的父元素给不给高度都可以,父元素如果没有高度,默认是子元素高度(它会被子元素的高度撑起来).