Html 我如何在桌子之间留出空间？

我正在学习html和css，我下载了一个PSD文件以转换为代码，但我有一个小问题：
我有我的桌子，但我需要知道，我怎么能在这里做一个空间

---

在这个链接中，我有HTML和CSS代码：

使用CSS更改表中该空间的宽度

table { 
    border-spacing: 10px;
    border-collapse: separate;
}

有关更多信息，请参阅：

然而，由于您没有真正的表格数据和更多的列表，我将使用列表：

HTML

<ul class="products">
    <li>
        <h2>Abercrombie &amp; Fitch</h2>
        <img src="http://dotacionesindustriales.net/images/4002%20Camisa%20Manga%20Corta%20Hombre-Oxford.jpg" />
        <div>
            <span class="price"><b>Price:</b> US $65</span>
            <span class="COD"><b>COD:</b> AE001 </span>
        </div>
    </li>
    <li>
        <h2>Hollister</h2>
        <img src="http://dotacionesindustriales.net/images/4002%20Camisa%20Manga%20Corta%20Hombre-Oxford.jpg" />
        <div>
            <span class="price"><b>Price:</b> US $65</span>
            <span class="COD"><b>COD:</b> AE001 </span>
        </div>
    </li>
    <!-- etc -->
</ul>

关于你原来的问题，最重要的部分是：

.products li
{
    float:left;
    margin-right:1em; /*Adjust this value to change the horizontal Spacing*/
    margin-bottom:1.2em;
}

除了更具语义的html之外，您还可以获得流畅布局的额外优势。如果三个产品在页面上不合适，它将相应地调整布局。同样，如果他们适合，它将容纳更多

---

请参见此处的操作：

您的代码应该包含在您的问题中。此外，这不是表格的用途，表格应仅用于显示表格数据。对于任何其他内容，请使用适当的显示属性。抱歉，我是新来的，我不知道如何将我的代码放入问题中。Tx.如何包含代码：如上所述，不要使用表格。想想你在展示什么。你正在展示一个产品列表，应该给你一个线索，你应该考虑使用什么标签。现在查看使用

display:inline block

或

float:left

设置列表中项目样式的选项。在学习HTML和CSS的过程中，您将了解一些常用工具：Firefox的Firebug（下载）和Chrome的开发者工具（inbuild）。这些功能使您能够检查html元素，查看应用于它们的样式，然后在样式表中最终确定它们之前（手动）练习样式！这是我一直在等待的答案：D谢谢！只要确保你去列表选项。。。你以后会感谢我的。重新设置列表样式要比尝试重新布局表容易得多。

.products li
{
    float:left;
    margin-right:1em; /*Adjust this value to change the horizontal Spacing*/
    margin-bottom:1.2em;
}