{eyou:channel type='top' row='10' id='field1' currentstyle='active'} // 第一级栏目循环开始<li>
<a href="{$field1.typeurl}" title="{$field1.typename}" class="{$field1.currentstyle}">
{$field1.typename}
{eyou:notempty name='$field1.children'}
有子栏目时才显示这里的html代码,比如:箭头、图标等
{/eyou:notempty}
</a>
{eyou:notempty name='$field1.children'} // 判断是否有子栏目(第二级栏目)start
<div>
{eyou:channel name='$field1.children' id='field2' row='10'} //第二级栏目循环开始
<div>
<a href="{$field2.typeurl}" class="dropdown-item ">{$field2.typename}</a>
{eyou:notempty name='$field2.children'} // 判断是否有子栏目(第三级栏目)start
<div class="dropdown-menu animate">
{eyou:channel name='$field2.children' id='field3' row='10'} //第三级栏目循环开始
<a href="{$field3.typeurl}" class="dropdown-item ">{$field3.typename}</a>
{/eyou:channel} //第三级栏目循环结束
</div>
{/eyou:notempty} // 判断是否有子栏目(第三级栏目)end
</div>
{/eyou:channel} // 第二级栏目循环结束
</div>
{/eyou:notempty} // 判断是否有子栏目(第二级栏目)end
</li>{/eyou:channel} //第一级栏目循环结束
三级的你就用上面来套用。要想确认后台是否有三级栏目以及前段样式有没有三级拉伸样式等
缺一不可