Tailwind CSS图片间隙消除求助：右侧及顶部空白问题

云上老周

2026-8-2

解决Tailwind CSS中图片右侧及顶部间隙问题

以下是几种针对性的解决方案，你可以逐一尝试：

设置图片为块级元素：默认图片是行内块元素，会因基线对齐产生间隙，给图片添加 block 类：
```
<img src="你的图片路径" class="block" alt="图片描述">
```
清除外边距并调整垂直对齐：结合 m-0 清除默认外边距，align-middle 修正垂直对齐方式：
```
<img src="你的图片路径" class="block m-0 align-middle" alt="图片描述">
```
容器与图片的适配处理：若图片在容器内，给容器添加 p-0 清除内边距，同时让图片占满容器宽度：
```
<div class="p-0">
  <img src="你的图片路径" class="w-full block" alt="图片描述">
</div>
```
消除父元素行高影响：如果图片所在父元素有行高，给父元素添加 leading-none 类：
```
<div class="leading-none">
  <img src="你的图片路径" class="block" alt="图片描述">
</div>
```