关于css垂直剧中的七种方法

385 阅读1分钟

1.table自带功能
   demo: 点击
2.100% 高度的 afrer before 加上 inline block
   demo: 点击
3.div 装成 table
   demo: 点击
4.margin-top -50%
   demo: 点击
5.translate -50%
   demo: 点击
6.absolute margin auto
   demo: 点击
7.flex
   demo: 点击

如果 .parent 的 height 不写,你只需要 padding: 10px 0; 就能将 .child 垂直居中; 如果 .parent 的 height 写死了,就很难把 .child 居中,以下是垂直居中的方法。 忠告:能不写 height 就千万别写 height。