0

我有一个<ul>HTML 中的基本列表，我想将其转换为 3 列网格。每个列表项都有一个固定宽度向左浮动，所以理想情况下我想：

<ul>
    <li>List 1</li>
    <li>List 2</li>
    <li>List 3</li>
    <li class="clear">List 4</li>
    <li>List 5</li>
    <li>List 6</li>
    <li class="clear">List 7</li>
    <li>List 8</li>
    <li>List 9</li>
    <li class="clear">List 10</li>
</ul>

目前我已经尝试过这个：

<ul>
{foreach $submenu.child.items as $row} 
    <li class="{if $row@iteration is div by 4}clear{/if}"><a href="#">{$row.label}</a></li>
{/foreach}
</ul>

正如您在下面看到的，这与第一行不同。例如：

<ul>
    <li>List 1</li>
    <li>List 2</li>
    <li>List 3</li>
    <li class="clear">List 4</li>
    <li>List 5</li>
    <li>List 6</li>
    <li>List 7</li>
    <li class="clear">List 8</li>
    <li>List 9</li>
    <li>List 10</li>
</ul>

更新：我可以让它工作的唯一方法是添加额外的 HTML。还有其他方法吗？

<ul>
{foreach $submenu.child.items as $row} 
    <li><a href="">{$row.label}</a></li>
    {if $row@iteration % 3 == 0}<li class="clearBoth"></li>{/if}
{/foreach}
</ul>
4

1 回答 1

2

你在乎第一个条目是否有“清除”吗？

如果你不这样做，那么

 {if $row@iteration % 3 == 1}

如果你这样做，那么你需要

 {if $row@iteration > 1 && $row@iteration % 3 == 1}

（或 Smarty 中的任何语法）。

如果你解释了这个问题会更有帮助，即它与计数有关，与 HTML 或 Smarty 无关。

于 2012-02-12T22:42:35.840 回答