vertical-align通常用于设置图片或表格与文本的垂直对齐方式，仅对行内元素或行内块元素有效。img{/*默认情况下，元素放置在父元素的基线上*/vertical-align:baseline;/*元素的顶部与行中最高元素的顶部对齐*/vertical-align:top;/*该元素位于父元素Middle的顶部*/vertical-align:middle;/*元素底部与整行底部对齐*/vertical-align:baseline;}图片和表格都是内联块元素，默认vertical-align是基线对齐，设置属性如果是middle，文字和图片可以垂直居中。有一个奇怪的现象。如果把图片和文字放在一条线上，图片的底部就会有空隙。我们在它的父元素上加了一个边框，让它更明显：这是因为图片默认是和文字的基线对齐的。常用的解决方案有两种：1.给图片添加一个vertical-align属性，取值为middle/top/bottomimg{vertical-align:top｜middle｜bottom;}2.将图片转为block-level元素img{display:block;}
