Question

以下是.hbs文件中的代码，用于一个接一个地创建多个表。最后有两个<br>标记，以确保创建的不同表之间有两个换行符

{{#each container}}
    <div>
      <table class="table table-responsive table-condensed table-bordered" style="margin-left:0px;float: left;align:left;">
        <thead>
          <tr>
            <th style="color:rgb(68, 67, 67);font-weight: normal;">...</th>
          </tr>
        </thead>
        <tbody>
          {{#each variable}}
            <tr>
              <td style="border:none;">...</td>                  
            </tr>
          {{/each}}
        </tbody>
      </table>
    </div>
    <br><br>
{{/each}}

但是在使用此hbs创建html页面后，两个换行符不可见。如何使这个工作？

Answer 1

而不是br使用内联样式并添加margin-bottom

     {{#each container}}
            <div style:"margin-bottom:30px;">
              <table class="table table-responsive table-condensed table-bordered" style="margin-

left:0px;float: left;align:left;">
            <thead>
              <tr>
                <th style="color:rgb(68, 67, 67);font-weight: normal;">...</th>
              </tr>
            </thead>
            <tbody>
              {{#each variable}}
                <tr>


        <td style="border:none;">...</td>                  
            </tr>
          {{/each}}
        </tbody>
      </table>
    </div>
    {{/each}}

Answer 2

问题在于line-height <br>元素，与Handlebars无关。您可以编写内联样式来处理空间，并且可以使用一个而不是两个。

<br style="line-height: 5rem;" />

希望这有帮助。

<br/>不在车把html模板文件的#each循环中工作

2 个答案: