html - div之间的差距

Question

我希望带有 id 标语的 div 以这样一种方式出现，即它与图像之间没有间隙。它是如何实现的？

这是小提琴...

这没有用

#tagline {
    margin-top:0;
height: 50px;
background-color: aqua;
}

score 4 · Accepted Answer

图像需要display:block;并且没有边距p

img {display:block;}
p {margin:0;}

score 1 · Accepted Answer

1

您还必须从 p 中删除边距：

#tagline p { margin-top:0; }

于 2013-10-20T14:00:39.883 回答

score 1 · Accepted Answer

要么使用 Moob 的答案，block要么使用这个 css3 flex。注意：Safari 和 IE不支持此功能：

img{display:flex;}
p { margin-top:0; }

score 0 · Accepted Answer

始终使用重置样式

* {
    margin: 0;
    padding: 0;
}

和 img 填充是因为 img 显示属性设置为内联（默认情况下），下面的代码将解决这个问题。

img {
    display: block;
}

score 0 · Accepted Answer

我建议您使用 css 重置，许多元素都有默认的填充和边距。在您的情况下，是divp内部的标签#tagline具有填充和边距

#tagline p {
    margin: 0;
    padding: 0;
}

工作演示（它没有 css 重置，还为您的菜单添加了 clearfix）

5 回答 5