.one {
/*默认的是基线对齐*/
vertical-align: baseline;
}
.two {
/*让图片的中线 对齐 文字的中线 垂直居中*/
vertical-align: middle;
}
.three {
/*让图片的顶线 对齐 文字的顶线 顶部对齐*/
vertical-align: top;
}
div {
border: 1px solid red;
}
div img {
/*因为默认的是基线对齐，所有底册有空白缝隙*/
/*1. 只要不是 基线对齐就好了*/
/*vertical-align: baseline;*/
/*vertical-align: bottom;*/
/*vertical-align: middle;*/
/*2. 块级元素来说 vertical-align: 是无效的 就不会有基线对齐的问题了*/
display: block;
}
原文：https://www.cnblogs.com/eric-share/p/13493498.html