>[danger]常见的水平垂直方式有几种? | 水平方向居中 | 属性 | 取值 | | ------------ | ------------------- | ------------------------------- | | 水平居中 | margin | 0 auto | | 水平居中 | text-align | center | | 水平居中 | display | flex; justify-content: center; | | 水平居中 | position + transform | left: 50%; transform: translateX(-50%); | | 垂直方向居中 | 属性 | 取值 | | ------------- | ---------------------------- | -------------------------------- | | 垂直居中 | line-height | 和父元素高度相等的值 | | 垂直居中 | display + table-cell | display:table-cell; vertical-align:middle; | | 垂直居中 | flexbox | display:flex; align-items:center; | | 垂直居中 | position + transform + flex | display:flex; align-items:center; position:relative; top: 50%; transform:translateY(-50%); | 以上是 CSS 中一些常见的水平、垂直方向居中方式,通过选择不同的属性和取值,可以实现不同的布局效果。