【前端】三种方法将文字垂直居中

本文用三种方法实现垂直居中

第一种方法针对单行文字,用line-height实现,即将行间距设置为高度的一半,但是当文字多行时,该方法无效。

第二种方法针对定高多行文字,用

实现

第三种方法针对定高多行文字,用display:table实现

以下为代码(该代码实现了当鼠标放到左边的两个div上时,放大一倍,实现方法为在js中将对应的宽高都设置为2倍,并appendChild上去)





    
    
    



   
left1
left2
table实现垂直居中table实现垂直居中
单独的一个div实现垂直居中


你可能感兴趣的:(前端)