Bootstrap <span>图像中的这个额外“空间”是什么？

Question

我正在尝试添加“X”图标，以便能够在Backbone.js中单击并删除某些内容。我正在使用Bootstrap的function SWEP:Initialize() self:SetWeaponHoldType(self.HoldType) end 图标。理想情况下，添加CSS后：悬停，我可以将鼠标悬停在“X”上并显示指针。但是，实际的“X”图标周围似乎有额外的空间，所以我可以将鼠标移动到“X”周围的一个小区域，但指针仍然显示，所以我猜这一切都属于元素。

这是我的意思的图片（它是“X”周围的绿色区域）：

为什么那里有“额外”的空间，我怎么能摆脱它呢？谢谢！

Answer 1

绿色区域是元素的填充，它包含在box model的一部分中。

Answer 2

如果要删除绿色区域，请在元素样式中添加padding: 0;。否则，要从可点击区域中排除绿色区域，请添加box-sizing: content-box;。您需要在下面的帖子中查看链接以获取更多详细信息。