0

<ul>3 列のグリッドに変換したい HTMLの基本的なリストがあります。各リスト項目は左に固定幅が固定されているため、理想的には次のようになります。

<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 に答える