Question

帕格新手在这里 - 我正在哈巴狗实施重复的html，只是为了让我的脚湿透。我已经获得了以下HTML，我试图在哈巴狗中捕获并遇到跨度问题。我从下面的示例中删除了不相关的类和其他内容以简化。

原始HTML：

<nav class="...">
    <div class="container">
        <div class="navbar-header">
            <button type="button">
                <span class="sr-only">toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
        </div>
    </div>
</nav>

Pug等效说明：

nav(class='...')
    div(class='container')
        div(class='navbar-header')
            button(type='button')
                span(class='sr-only') toggle navigation

Pug生成的HTML：

<nav class="...">
  <div class="container">
    <div class="navbar-header">
      <button type="button"><span class="sr-only">toggle navigation</span></button>
    </div>
  </div>
</nav>

我意识到它在语法上是一样的但是我在做什么就是触发它与按钮（它在DOM中的父节点）在同一行上执行跨度。叫我奇怪，但我喜欢能够轻松阅读HTML，是的，我希望能够使用＆＃34; - 漂亮＆＃34;选项..我只想了解它为什么这样做..想法??

如果重要的话，这是帕格2.0.3。

Answer 1

谢谢@Sean！我正在深入研究一些我以前从未有机会使用的工具，因此对我来说有一点学习曲线。

我给你的答案是肯定的，但我并不坦率地确定如何这样做..

Pug：处理<span>的正确语法

1 个答案: