img标签默认间隙

问题：

块级元素包含内联元素如图片文字等时，出现间隙

 ——内联元素默认是和父级元素的baseline（基线）对齐的，而baseline又和父级元素底边有一定的距离（这个距离和font有关，不一定是5px），所以以上代码的效果中不同div之间有间隙，这是因为图片与父元素的底边有距离。说到baseline呢，其实它是vertical-align属性的默认值，vertical-align属性是设置元素的垂直排列的，用来定义行内元素的基线相对于该元素所在行的基线的垂直对齐，除了baseline对齐方式之外，还可以是sub | super | top | text-top | middle | bottom | text-bottom |inherit（任何的版本的Internet Explorer （包括 IE8）都不支持属性值 "inherit"）。

解法：—— 消除baseline对齐方式产生的距离。

 1. 设置img的vertical-align属性为bottom；

 2.父元素加上font-size:0的属性；

 3.既然为0可以，那把行高设的很小可不可以呢？经试验发现，本例图片大小为200px，设line-height不大于12就能够消除间隙了，鉴于这个距离一般是5px，所以可以把line-height设为5px左右；

------------------------------------------------------------------------------------------------------------------------------------------------------

问题：

　　多个img标签的左右间隙

 ——当行内元素之间有“回车”、“tab”、“空格”时就会出现间隙。

解法：

　　 1.去掉img标签之间所有的空格;

 2.多行注释，把空格回车什么的注释掉；