本文提供了四种有效的方法来解决在特定布局下图片底部出现空白的问题，包括使用浮动、调整字体大小、垂直对齐及负边距等技术手段。
解决方法 一
使 li 浮动，并设置 img 为块级元素
ul { width:280px; }
ul li { display:block; float:left; height:57px; width:277px; }
img { display:block; }
解决方法 二
设置 ul 的 font-size:0;
ul { width:280px; font-size:0; }
ul li { display:block; height:57px; width:277px; }
解决方法 三
设置 img 的 vertical-align: bottom;
ul { width:280px; font-size:0; }
ul li { display:block; height:57px; width:277px; }
img { vertical-align:bottom; }
解决方法 四 我认为是最傻的
设置 img 的 margin-bottom: -5px;
ul { width:280px; font-size:0; }
ul li { display:block; height:57px; width:277px; }
img { margin-bottom:-5px; }
扫一扫
571
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
