- 水平布局
- inline-block+text-align
- IE6,7下用display:inline;romm:1;来替代display:inline-block;
- table+margin
- .child{display:table;margin:0 auto;}
- absolute+transform
- .parent{position:relative;}.child{position:absolute;left:50%;transform:translateX(-50%);}
- flex+justify-content
- .parent{display:flex;justify-content:center}
- .parent{display:flex;.child{margin:0 auto;}}
- inline-block+text-align
- 垂直居中
- table-cell+vertical-align
- .parent{display:table-cell;vertical-align:middle;}
- absolute+transform
- .parent{display:relative;}.child{display:absolute;top:50%;transform:translateY(-50%);}
- flex+align-items
- .parent{display:flex;align-items:center}
- table-cell+vertical-align
- 居中
- inline-block+text-align+table-cell+vertical-align
- .parent{text-align:center;display:table-cell;vertical-align:middle;}.child{display:inline-block;}
- absolute+transform
- translate:transform(-50%,-50%)
- -
- inline-block+text-align+table-cell+vertical-align
居中布局
最新推荐文章于 2024-03-13 18:09:44 发布