去除网页img和文字之间的空隙

1.网页布局时，经常会遇到图片和文字之间有空隙，如下

这是由于图片img被当作了文字元素，和文字就会有基线对齐问题，就会产生空隙。

2.解决方案：

1.为图片img设置vertical-align

img{
            width:361px;
            height:294px;
            /* 设置vertical-align和display去除图片和文字之间的空隙 */
            vertical-align:bottom; 
 }

效果图：

2.将图片转换为块级元素，因为块级元素不存在基线对齐问题

img{
            width:361px;
            height:294px;
            /* 设置vertical-align和display去除图片和文字之间的空隙 */
            display: block; 
        }

效果图：