盒子居中对齐的N种方法

不知名小魚
142 阅读1分钟

1.flex布局

1.png

实现的界面:

1.1.png

2.定位+transfrom

2.png

实现的界面:

2.2.png

3.绝对定位

3.png

实现的界面:

3.3.png

4.定位+方位名词0

4.png

实现的界面:

4.4.png

5.负margin居中（传统方法）

5.png

实现的界面:

5.5.png

6.margin固定宽高居中

6.png

实现的界面:

6.6.png

7.不确定宽高居中

7.png

实现的界面:

7.7.png

8.table-cell居中（最不常用)

8.png

实现的界面:

8.8.png

avatar
文章
阅读
粉丝