Question

我有以下haml：

  9       %strong Asked by:   
 10       = link_to @user.full_name, user_path(@user)     
 11       .small= "(#{@question.created_at.strftime("%B %d, %Y")})"

这当前将链接和日期放在单独的行上，当它看起来应该像“link（date）”并且date的类跨度很小.....

Answer 1

您的代码将生成类似这样的内容：

<strong>Asked by:</strong>
<a href="userpath">User name</a>
<div class='small'>April 26, 2011</div>

当您使用类似.small的内容时（即使用点而不指定元素类型）haml会创建implicit div。由于div元素默认为block level elements，因此日期将位于新块中，因此将显示在新行中。为了使其显示在同一行，您需要inline level element。

您可以更改“小”类的css以明确显示内联，但html已经提供了div的内联版本 - span，因此您可以更改最后一行从

.small= "(#{@question.created_at.strftime("%B %d, %Y")})"

到

%span.small= "(#{@question.created_at.strftime("%B %d, %Y")})"

会给你

<strong>Asked by:</strong>
<a href="userpath">User name</a>
<span class='small'>April 26, 2011</span>

这些都是内联元素，因此将显示为一行。

至于把它全部放在haml的同一行，我认为用普通的haml语法是不可能的。 Haml使用缩进和空格来确定要做什么，只有一行就意味着没有缩进。

haml FAQ说：

表达文档的结构并表达内联格式是两个非常不同的问题。 Haml主要是为结构而设计的，因此处理格式化的最佳方法是将其留给其他专为其设计的语言。

你似乎处于haml的目标边缘。你可以直接写你的html，如果你真的想要一行：

<strong>Asked by:</strong> #{link_to @user.full_name, user_path(@user)} <span class="small">(#{@question.created_at.strftime("%B %d, %Y")})</span>

或者你可以创建一个帮助器来为你生成块。

Answer 2

要使其显示在浏览器的同一行，请使用%span.small，如上面的评论所示。

要在HTML输出中的所有内容中创建所有内容，您需要在Haml中使用whitespace removal语法。请理解HTML输出中的换行符不会影响浏览器中文本的排列。

如何在同一行显示几条haml线？

2 个答案: