一句话概括：为什么<a>标签比里面的img高度多出4px 的问题，主要还是由于 img是inline element, it's height is caculated differently as related to the
default line-height value. On inline elements, the line-height css property specifies the height that is used in the calculation of the line box height.
on block level elements, line-height specifies the minimal height of line boxes within the element.
------------------------------------------------------------------------
Trying adding:
img { display: block; }to your CSS. Since an <img> is an inline element by default, it's height is calculated differently as related to the default line-height value.
On inline elements, the line-height CSS property specifies the height that is used in the calculation of the line box height.
On block level elements, line-height specifies the minimal height of line boxes within the element.
Source: https://developer.mozilla.org/en/CSS/line-height
