企业官网建设流程全解析

1. 行内/行内块元素水平居中

给父元素设置：text-align: center

适用：文字、span、a、img、input、button 等。

2. 块级元素水平居中

方案一：margin 居中（常规首选）

元素定宽时：margin: 0 auto

方案二：Flex 居中（不定宽通用）

父 { display: flex; justify-content: center; }

3. 垂直居中方案大全

（1）单行文本垂直居中

height = line-height

（2）Flex 万能居中（推荐）

父 { display: flex; justify-content: center; align-items: center; }

（3）绝对定位居中（不定高宽通用）

父 { position: relative; } 子 { position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; }

（4）transform 居中

子 { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }