CSS 实现盒子水平垂直居中的方法
效果展示
原始效果
居中效果
原始代码
html 部分
1 |
|
css 部分
1 |
|
实现方法
absolute + margin
1 |
|
absolute + 负 margin
1 |
|
absolute + transform
1 |
|
margin + transform
1 |
|
flex
1 |
|
或者
1 |
|
grid
1 |
|
或者
1 |
|
table-cell
1 |
|
CSS 实现盒子水平垂直居中的方法
https://blog.xukaiyyds.cn/posts/ca5259af/
1 |
|
1 |
|
1 |
|
1 |
|
1 |
|
1 |
|
1 |
|
或者
1 |
|
1 |
|
或者
1 |
|
1 |
|