Question

我正在编写Jade中的一些按钮，我对间距如何工作有点困惑。

顶部的示例函数，但是所有按钮都太靠近了。

第二个示例（在“a(href”之前添加了空格）在正确间隔按钮的同时完全断开链接。

玉是否对间距敏感？谁能告诉我这里发生了什么？

div.sub-menu
  div.wrapper
   a(href="#/microsite/a")
    input(type="button", class="button white-button", value="A" )
   a(href="#/microsite/p")
    input(type="button", class="button white-button", value="P" )




div.sub-menu
  div.wrapper
    a(href="#/microsite/a")
    input(type="button", class="button white-button", value="A" )
    a(href="#/microsite/p")
    input(type="button", class="button white-button", value="P" )

Answer 1

是的，Jade对间距很敏感。间距决定了每个标记的嵌套。

那么，下面的代码在哪里

element
  child

会生成此HTML：

<element><child></child></element>

代码

element
child

会产生这个：

<element></element><child></child>

当然，在浏览器中查看时会导致完全不同的结果。

要在每个链接前添加一个空格，您需要通过在父标记之后添加空格（您可以为第一个链接执行此操作）或piping它（在第二个链接之前的单独行上）链路）。

请注意，在指定标记内容/管道文本时，实际文本内容前面有空格。不输出该空白区域。因此，实际上，要管道空白区域，您需要一个|字符，后跟两个空格。

例如为：

div.sub-menu
  //- div.wrapper is followed by *two* spaces
  div.wrapper  
   a(href="#/microsite/a")
    input(type="button", class="button white-button", value="A" )
   //- The | is followed by *two* spaces
   |  
   a(href="#/microsite/p")
    input(type="button", class="button white-button", value="P" )

当然，如果结果不理想，您还可以使用CSS padding和margin来增加间距。

Answer 2

你在玉器中使用“漂亮”选项吗？如果你这样做，请将其关闭，因为HTML中的空格几乎不可靠。

玉间距破扣？

2 个答案: