关于CSS问题,得凑够10啊

代码如下,很简单的

 <style>
        html,body { font-family:"微软雅黑"}
        html,body,div{padding:0; margin:0; border:0; outline:0;}

        .slideBox{width:640px; height:300px; overflow:hidden;}
        .items  div{display:inline-block;}
    </style>

3个图片自身的宽高相同,宽为640px,高为300px

 <div class="slideBox">
    <div class="items">
        <div><a href="#"><img src="img/1.jpg"></a></div>
        <div><a href="#"><img src="img/2.jpg"></a></div>
        <div><a href="#"><img src="img/3.jpg"></a></div>
    </div>
</div>

在浏览器上查看,包裹 a 标签的那3个div的高均为303px,为什么会多出来3px,不明白。请各位不吝赐教

img设置display变为块级元素
img容器多出4px空白边解决办法

把img和a都去一下边框试一下