html多行垂直居中,图片和多行文本的垂直居中

最新推荐文章于 2024-09-16 09:20:49 发布

李萌康

最新推荐文章于 2024-09-16 09:20:49 发布

阅读量167

点赞数

文章标签： html多行垂直居中

图片和多行文本的垂直居中

.box01{ line-height: 200px; font-size: 0; font-size: 1px\9; text-align: center; background: #ddd;}

.box01 img{ vertical-align: middle;}

.box02{ line-height: 200px; font-size: 0; font-size: 1px\9; text-align: center; background: #ddd; margin-top: 20px;}

.box02 .text{ display: inline-block; vertical-align: middle; max-width: 70%; line-height: 24px; font-size: 14px; text-align: left;}

.box03{ line-height: 200px; font-size: 0; font-size: 1px\9; text-align: center; background: #ddd; margin-top: 20px;}

.box03 .ico{ display: inline-block; vertical-align: middle; background: url(http://pimg1.4008000000.com/app_p_w_picpaths/4008000000/youhui/cpbaoxian/official/nvshenjiehd2016/nsj_ico.png) no-repeat; width: 49px; height: 49px; background-position: -111px 0;}

.box03 .text{ display: inline-block; vertical-align: middle; width: 200px; line-height: 24px; font-size: 14px; text-align: left; margin: 0 0 0 10px;}

涉水行驶，“心脏”受得了吗？

这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容这就是内容

这是一段内容这是一段内容这是一段内容这是一段内容这是一段内容这是一段内容这是一段内容这是一段内容这是一段内容