← 返回首页
元素水平垂直居中的实现方法
- Flex 布局:
display: flex; justify-content: center; align-items: center; - 绝对定位 + transform:
position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); - Grid 布局:
display: grid; place-items: center; - 绝对定位 + margin auto:
position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;(需指定宽高)