遇到一个小问题,记录一下。
1、问题描述
<div class="thumb-box">
<img class="tt-img" src="https://cdn.w7.cc/images/2017/11/09/15102068385a03ed7644fbf_OxLCy7ypXKpd.png?imageView2/5/w/88/h/88/format/png" alt="">
</div>
<style lang="less" scoped>
.thumb-box {
border: 1px solid red;
width: 200px;
img {
margin: 0px;
}
}
</style>

可以看到,图片下方不是很服贴额。
2、解决,给img加上display: block;就OK。
img {
margin: 0px;
display: block;
}

本文记录了一个关于图片显示的小问题及解决方案。问题在于图片底部出现额外的空白,影响页面布局美观。通过调整CSS样式,将img元素的display属性设置为block,成功解决了这一问题。
802





