day33-css居中

居中总结

经常会碰到一些居中的问题,这里尝试进行一些总结。分为垂直居中和水平居中。


水平居中

  1. 行内或类行内元素(inline/inline-block/inline-table/flex):text-align: center;
  2. 块级元素: margin: 0 auto;
  3. 多个块级元素:display: inline-block;

    垂直居中

  4. 行内或类行内元素:
    • 单行:padding-top与padding-bottom 等值、或line-height与height 等值
    • 多行:单行padding等值,或display: table-cell 用vertical-align:middle;
  5. 块级元素:

– 待续

文章作者: lmislm
文章链接: http://lmislm.com/2019/02/12/2019-02-12/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 LMISLMのBlog