我必须使用  在翡翠的空间？

Question

我正在使用Jade,除了Jade"吃掉"我的空间外,一切都很酷.

例如,在HTML中:

<b>Hello</b> <b>World</b>

要么

<b>Hello</b>
<b>World</b>

"Hello"和"World"之间会有一个空格.

但是当转换为Jade时,它就是

b Hello
b World

当呈现为HTML时,空间消失了.喜欢:

<b>Hello</b><b>World</b>

我是否必须添加 我的Jade模板或者是否有任何方法可以在生成的HTML中获得正常空间？

Answer 1

当然,当你有两个相同的标签后,你可以简单地合并它们:

b Hello World

但是,如果你有两个不同的兄弟标签,并希望它们之间有空格,你可以使用管道输出它们之间的空间.

例如:

b Hello
|     <-- 2 spaces after the pipe
i World

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

如果您所处的环境中未保留尾随空格,则可以使用以下命令:

b Hello
=" "
i World

= 计算JavaScript表达式并输出结果.

还要注意的 是不相同的,如HTML的空间.要使用的正确HTML实体 (或者 如果您喜欢十六进制数字).

 代表ñ导通b reaking SP王牌.它的字符代码是160( ).不同之处在于,在使用普通空间的情况下,多个空格将显示为单个空格,如果一条线溢出,则文本将在下一行继续.*另一方面,将显示非破坏空格.线条永远不会包裹在使用不间断空间的地方.

最好用一个例子来说明:

 

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    (Note the scroll bar at the bottom.)

空间( )

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    (Note there is no scroll bar because all spaces are concatenated into one.)

_{*这可以用CSS white-space属性覆盖.某些元素(例如<pre>,默认情况下显示所有空格和行结尾).}

Answer 2

我为explicid空格做了一个mixin:

mixin space()
  | !{' '}

所以你只需要:

b Hello
+space
b World

Answer 3

这应该这样做:

b Hello
  | World

不幸的是,它在我的机器上的Chrome中生成了这个HTML输出:

<b>
              Hello
              World</b>

但最终变成了:

结束

b Hello  
b World

......也会这样做.