css使用img后的高度多了4px

由于img是行内元素,默认display: inline; 它与文本的默认行为类似,下边缘是与基线(baseline)对齐,而不是紧贴容器下边缘。

将displayp设置为block即可消除4px的bug。

其实解决方法不止一种:
1.将图像定义成 img:{display:block;}
2.给父级设置固定高度,然后 overflow:hidden
3.设置 font-size:0;
4.设置 img 的 vertical-align: bottom;
5.设置 img 的 margin-bottom: -4px;

posted @ 2024-08-20 17:29  。活着。  阅读(68)  评论(0)    收藏  举报