html子div在父div中居中显示,文字或是子div在父div里垂直居中

只有一行文字的话，直接用line-hight可以解决。

有多行文字或是想要子div在父div里垂直居中：

首先要理解vertical-align: middle只在table属性中才会垂直居中，应用到display:inline-block元素的话就是和隔壁元素居中对齐。

方法一：

在div里增加一个隐藏子元素，高度为100%和父div一样，这样再设置vertical-align: middle的话子div就会和父div一样高的子元素垂直居中对齐。

}.box img{width:100px;height:100px;vertical-align:middle;

}.box span{display:inline-block;vertical-align:middle;

}

}.div_em{display:inline-block;*display:inline;*zoom:1;height:100%;vertical-align:middle;

}.demo2 .txt{font-size:12px;

}

文字
文字