img-thumbnail 的“白边”源于其默认的 padding: 0.25rem 和 border: 1px solid #dee2e6；去除需同时设 padding: 0 和 border: none，推荐用自定义类覆盖，注意类顺序，并检查父容器背景、box-sizing 及图片透明度等干扰因素。
为什么 img-thumbnail 会有白边
Bootstrap 4 的 img-thumbnail 类默认设置了 padding: 0.25rem 和 border: 1px solid #dee2e6，这两者叠加在图片上，视觉上就形成了“白边”——实际是浅灰边框 + 内边距留出的空白。不是图片自身带白边，而是 CSS 主动加的。
直接覆盖 padding 和 border 最有效
最稳妥的做法是用自定义类覆盖这两个属性，避免影响全局或依赖 !important（除非必要）：
.no-thumb-border {
padding: 0;
border: none;
}
然后在 HTML 中组合使用：<img src="..." class="img-thumbnail no-thumb-border" alt="怎样用CSS去除Bootstrap 4中图片缩略图img-thumbnail的白边" >。注意顺序：自定义类写在 img-thumbnail 后面，CSS 优先级才够。
- 不要只设
border: 0，padding还在，白边依然存在 - 不要用
!important除非你无法控制类名顺序或引入顺序 - 如果项目用了 Sass，可直接在变量中重置
$thumbnail-padding和$thumbnail-border-width
用 img-fluid 替代？不推荐
img-fluid 只负责响应式缩放（max-width: 100% + height: auto），它不提供边框或内边距，也不替代 img-thumbnail 的样式意图。如果你只是想让图铺满容器且无边框，直接用 img-fluid 即可，但这就不是“去除缩略图白边”，而是彻底不用缩略图样式了。
立即学习“前端免费学习笔记（深入）”；
- 场景判断：真需要缩略图的圆角、阴影等效果？那就覆盖；不需要，就别加
img-thumbnail -
img-thumbnail默认还有border-radius: 0.25rem，如需保留圆角但去白边，只清padding和border即可
检查是否被其他样式干扰
有时白边看起来“去不掉”，其实是父容器有 background-color（比如白色背景下的浅灰边框不明显，换成深色背景就突出了），或者图片本身带透明像素、外边距（margin）、或被 figure 等 Bootstrap 组件包裹后继承了额外间距。
- 用浏览器开发者工具选中图片，看 computed 样式里
padding、border、margin、background-color的真实值 - 特别留意
box-sizing：Bootstrap 4 默认是border-box，所以padding和border不会撑大尺寸，但会影响内容区域大小 - 如果图片是 SVG 或含透明底，白边可能是渲染残留，此时加
background: transparent也可能有帮助
