使关闭和打开 div 标签与 HAML 出现在同一行

Question

我最近发现 HTML 对空格做了一件奇怪的事情，其中 div 标签在不同的行上打开和关闭，每个标签之间都有大约 4px 的边距。

您可以通过将结束 div 标记和结尾的开始 div 标记放在同一行来解决此问题，但纠正此问题的最佳方法似乎是通过以下方式覆盖它给他们绝对定位和负边距。

我可以用 HAML 完成前者吗？最好不是整个 div 标签及其中的所有内容，只是结束和开始标签。

Answer 1

我知道的唯一选项（我的意思是在他们的文档上）可以让您对输出格式进行一些控制的是切换器 -t，它可以是 ugly 或默认的 intended 。 ugly 会省略缩进，所以我想运气不好。

这个 haml 示例的含义：

.container
  .wrapper
    .something-esle
      a neat text here
    .something-esle
      a neat text here

将使用命令 haml -t ugly test.haml test.html 进行渲染进入：

<div class='container'>
<div class='wrapper'>
<div class='something-esle'>
a neat text here
</div>
<div class='something-esle'>
a neat text here
</div>
</div>
</div>

其中 haml test.haml test.html 输出：

<div class='container'>
  <div class='wrapper'>
    <div class='something-esle'>
      a neat text here
    </div>
    <div class='something-esle'>
      a neat text here
    </div>
  </div>
</div>

你遇到了什么问题，是 display:inline 或 display:inline-block 风格的一个众所周知的问题，space 因为该元素被视为字符。有很多技巧，比如在容器上将字体大小设置为 0px，然后在块上恢复它，或者改用 float。

关注这些堆栈以获取有关该主题的更多详细信息：

How to remove the space between inline-block elements?

A Space between Inline-Block List Items

使关闭和打开 div 标签与 HAML 出现在同一行

Making closing and opening div tags appear on same line with HAML

html

css

haml

whitespace

margin