Html div和img之间的空间？

我有这样的代码：

        <div id="sc">  
            <h1>1. Orange</h1>
            <p>some text in here </p>                                          
        </div>
        <img class="separator" src="images/separator.png" /> 

---

这是因为标签之间有空格

做：

---

没有屏幕截图可供参考，我对你想要的东西一无所知，所以这都是猜测

我从

class=“separator”

中猜测，您正试图用一条水平线将内容拆分。如果是这样的话，您不应该使用带有适当样式的

在任何情况下，请注意，

元素默认设置了垂直边距

我不明白你为什么想要分隔符紧贴文本，因为它在视觉上对我来说没有意义

如果你真的这么做了，有很多选择：

设置

页边距底部：0在

设置

页边距顶部：-*px

在

.separator

上，假设在分隔符前面总是有一个元素，其下边距为

*px

#sc p:last child{margin bottom:0；}

，并允许较旧的Internet Explorer版本支持它

---

但我重申,；我觉得文本和分隔符之间没有边距不合适。

添加显示：块；转到.separator图像。

.separator {
    margin: 0;
    padding: 0;
    display: block;
}

---

问题是图像有时会在其上/下添加一些神奇的空间，每当我将图像元素作为

*block*

元素使用时，我都会遇到这个问题。

我在图像和div标记之间有3倍的间隙。此外，所有样式都设置为0。真奇怪

修复方法：

img {
   vertical-align: middle;
}

---

这对我来说效果很好。

是新线吗？你有没有把try

请显示实际的CSS样式和/或网页。“我一直在尝试删除HTML中的空白，但没有帮助”很好的答案，我以前有一个带有display:block的，但将其添加到了#sc中。非常感谢。讨厌这种魔法。。。没有边距，没有填充，增加20像素？那简直是疯狂！如果不是块元素，默认情况下会使用哪种类型的显示图像？@user751564它们使用显示：inline@Marko是否所有内联元素都创建了此间距？已解决，必须使用img标记上的display:block。由于设计原因，实际上不能使用
。此外，我的分隔符必须正好位于这个div的下方，因为它的背景（div以分隔符开始，以分隔符结束，所以它看起来像一个带有顶部和底部分隔符作为边框的花式方框）。我的这个神奇间距不是由边距或填充创建的。这为我解决了问题。谢谢也为我工作！我也有同样的口才（在img和div之间）…奇怪，这是正确的答案。这是一个奇怪的现象，但这移除了底部的空间，而不是简单地将图像置于可用空间的中心。这确实是正确的答案。如果能有一个解释就太好了。发生了什么，为什么这有帮助。
.separator {
    margin: 0;
    padding: 0;
    display: block;
}

img {
   vertical-align: middle;
}