Css 内联块不堆叠我的"；积木；

我试图在这些“块”之间加上一些边距。问题是它们之间没有3个像素的空间来“阻塞”。它们只是堆叠在一起（典型的div标签）

​

为什么它不起作用？演示：

---

提前感谢。

在内部div上应用边距，而不是父级。

您应该使用样式表

除此之外，

内联块

和其他css语句必须位于子div上：

<div>
    <div style="margin: 3px; vertical-align: middle; display: inline-block; background-color: #000000; height: 100px; width: 100px;"></div>
    <div style="margin: 3px; vertical-align: middle; display: inline-block; background-color: #000000; height: 100px; width: 100px;"></div>
    <div style="margin: 3px; vertical-align: middle; display: inline-block; background-color: #000000; height: 100px; width: 100px;"></div>
    <div style="margin: 3px; vertical-align: middle; display: inline-block; background-color: #000000; height: 100px; width: 100px;"></div>
</div>​

HTML

​

这里有一把小提琴，展示了如何操作：

---

如果要将边距和内联块特性添加到父元素而不是子元素，请将代码更改为：

<div>
    <div style="background-color: #000000; height: 100px; width: 100px; display: inline-block; margin: 3px;"></div>
    <div style="background-color: #000000; height: 100px; width: 100px; display: inline-block; margin: 3px;"></div>
    <div style="background-color: #000000; height: 100px; width: 100px; display: inline-block; margin: 3px;"></div>
    <div style="background-color: #000000; height: 100px; width: 100px; display: inline-block; margin: 3px;"></div>
</div>​

​

---

它应该能用。

非常感谢！你的回答很有魅力^^^我会尽可能接受的。

.child{
    margin: 3px;
    vertical-align: middle;
    display: inline-block;
    background-color: #000000;
    height: 100px;
    width: 100px;
}

<div>
    <div class="child"></div>
    <div class="child"></div>
    <div class="child"></div>
    <div class="child"></div>
</div>​

div.container div {
 margin-bottom:3px;
 background-color: #000;
 height: 100px;
 width: 100px;"
}

<div>
    <div style="background-color: #000000; height: 100px; width: 100px; display: inline-block; margin: 3px;"></div>
    <div style="background-color: #000000; height: 100px; width: 100px; display: inline-block; margin: 3px;"></div>
    <div style="background-color: #000000; height: 100px; width: 100px; display: inline-block; margin: 3px;"></div>
    <div style="background-color: #000000; height: 100px; width: 100px; display: inline-block; margin: 3px;"></div>
</div>​