常用CSS实现DIV文本内容水平垂直居中

 

第一种：利用CSS中的  display的table-cell  实现

 
/*让元素渲染为表格单元格*/
    display:table-cell;

/*设置文本水平居中*/
    text-align:center; 

/*设置文本垂直居中*/
    vertical-align:middle;     

 

 第二种利用 ：flex盒子布局 写在父级上

    弹性盒模型  
    display:flex;

   主轴居中对齐 
    justify-content: center;

   侧轴居中对齐 
    align-items: center;