html - 用于定位的 div 之间的注释 block

Question

我最近访问了一个网站，发现在大多数 div 之间都使用了一个注释 block 来“下推”元素。在我看来，这不是正确的做法，但在商业上这样做是否可以接受？

HTML

<div class="layout__item">

    </div><!--

    --><div class="layout__item">

    </div><!--

    --><div class="layout__item">

</div>

CSS

.layout__item {
    display: inline-block;
    padding-left: 22px;
    vertical-align: top;
    width: 100%;
}

Answer 1

注释不是为了“将元素向下推”，而是为了在呈现的输出中保留空白，同时保持 html 的可读性。关键在于 css 中的 display: inline-block——没有每个 layout_item 之间的注释，源代码中的每个标签之间的空格分隔它进入渲染输出的方式，在那种情况下这通常不是您想要的。

在 https://css-tricks.com/fighting-the-space-between-inline-block-elements/ 上对此问题进行了更深入的讨论。