html - 移除 HTML 元素之间的视觉空白

我是 HTML 的新手，在编译运行时我需要一些帮助来删除 HTML 代码中的可视空白。

这就是我希望我的 HTML 页面在这个特定区域中的样子:

enter image description here

这就是它在我这边的样子(我不想要这个。我希望它看起来像上图)

enter image description here

这是我用于表格元素的代码:

<ul>
    <li>
    <p>Gorras</p>
    <ol>
        <li>Small - $10.00</li>
        <li>Medium - $12.00</li>
        <li>Large - $15.00</li>
</ol>        
</li>
</ul>

<ul>
    <li>
    <p>Camisas</p>
    <ol>
        <li>Small - $20.00</li>
        <li>Medium - $22.00</li>
        <li>Large - $25.00</li>
</ol>        
</li>
</ul>

<ul>
    <li>
    <p>Calzado</p>
    <ol>
        <li>Small - $50.00</li>
        <li>Medium - $60.00</li>
        <li>Large - $75.00</li>
</ol>        
</li>
</ul>

<ul>
    <li>
    <p>Gafas</p>
    <ol>
        <li>Small - $10.00</li>
        <li>Medium - $12.00</li>
        <li>Large - $15.00</li>
</ol>        
</li>
</ul>

有什么方法可以删除每个列表之间的这些空格？

非常感谢，请原谅我，因为我是 HTML 新手。

最佳答案

只需将 margin:0 放在您的 p 和 ul 元素上

参见 here

关于html - 移除 HTML 元素之间的视觉空白，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25535142/