Question

有没有什么可以做margin做的事情，但没有该区域的背景图？例如，当您提供元素margin: 1em时，元素周围会出现1em个空白边框，但背景会在该区域中绘制。是否有类似的东西，除非背景没有绘制？

我的问题是我试图在float: left ed div下面放置一些东西，而现在我无法在它和它之上的float ed div之间找到任何间距。它们只是直接相互抵靠。

低于div ed float: left的{{1}}具有属性div。如果有某些内容使clear: both与div之间的float div之间有空格，那么这也会有效。

Answer 1

边距应该是透明的。我认为你在这里看到的是利润率下降。尝试在你的div周围放一个1px的边框，看看会发生什么。

查看CSS 2.1规范：

http://www.w3.org/TR/CSS21/box.html#collapsing-margins

Answer 2

也许您正在寻找：

border: 4px white; /* replace with your color */

Answer 3

对于浮动元素，忽略它们旁边元素周围的边距。我认为你必须在浮动元素和你想要的项目之间创建一个额外的元素。

Answer 4

也许这个例子有助于解释（并解决）你的问题？

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8" />

    <style>
        * { margin: 0; padding: 0; }
        h1, p { background-color: #eee; margin: 10px 0; }
        div { background-color: pink; float: left; width: 100px; height: 100px; margin-right: 1px; }
        br { clear: both; display: block; }
    </style>
</head>

<body>

<h1>Hello, World!</h1>

<div></div>
<div></div>
<div></div>

<br />

<p>Lorem ipsum dolor set amit...</p>

</body>
</html>

Answer 5

由于元素是浮动的，因此不会始终正确地考虑边距空间。使用边距/边框黑客，只需将元素的颜色设置为与页面背景相同的颜色，并将其厚度设置为您想要的任何颜色。如在以下帖子中：

http://socialstreams.co/41/CSS_MarginBorder_Hack

像边距或填充之类的东西，除非背景不绘制

5 个答案: