水平居中（宽度自适应）1.内联块+text-align.child{显示：内联块；/*成为内联块元素，使元素宽度自适应，不继承父元素的宽度；*/}.parent{text-align:center;}2.table+margin.child{display:table;/*成为表格元素，可以让元素的宽度自适应，不继承父元素的宽度；*/保证金：0自动；}3.absolute+transform.parent{position:relative;}.child{position:absolute;/*定位允许元素宽度自适应，不继承父元素的宽度；*/transform:translateX(-50%);left:50%;}4.flex+justify-content.parent{display:flex;justify-content:center;}/*or*/.parent{display:flex;}.child{margin:0auto;}垂直居中（高度自适应）1.table-cell+vertical-align.parent{display:table-细胞;/*成为一个类似td的元素*/vertical-align:middle;}2.absolute+transform.parent{position:relative;}.child{position:absolute;/*定位可以让元素的宽度自适应，不继承父元素的宽度；*/顶部：50%；变换：translateY(-50%);}3.flex+align-items.parent{显示：弹性；align-items:center;}水平和垂直居中inline-block+text-align+table-cell+vertical-align.parent{text-align:center;显示：表格单元格；vertical-align:middle;}.child{display:inline-block;}2.absolute+transform.parent{position:relative;}.child{position:absolute;/*定位允许元素宽度自适应，不继承父元素的宽度；*/顶部：50%；左：50%；transform:translate(-50%,-50%);}3.flex+align-items+justify-content.parent{显示：flex;对齐项目：居中；justify-content:center;}二、多栏布局

left