易优CMS 列表页：前 N 条和后面N条数据使用不同样式实现教程

功能说明：在 eyou:list 循环列表中，实现前面几条内容采用一套样式，剩余条目使用另一套样式，常用于首页资讯、产品列表，头部突出展示，后面常规排版。

代码示例

{eyou:list titlelen='40' pagesize='9' infolen='50'}
    {if $i <= 4}
        <!-- 前4条内容：写头部特殊样式HTML -->
    {elseif $i <= 8}
        <!-- 第5条~第8条：写后面常规样式HTML，数字8可自行修改 -->
    {/if}
{/eyou:list}

代码讲解

1. $i 是列表循环内置变量，代表当前循环的序号，从 1 开始计数。
2. {if $i <= 4}：判断当前是第 1~4 条，这部分可以写大图、加粗、多列等特殊展示样式。
3. {elseif $i <= 8}：判断当前是第 5~8 条，这部分写普通列表样式，数字 8 根据你的需求修改。
4. pagesize='9'：代表当前列表一共调用 9 条数据，按需调整。

拓展写法参考

场景 1：前 3 条特殊样式，剩下全部统一样式（更常用）

{eyou:list titlelen='40' pagesize='10' infolen='50'}
    {if $i <= 3}
        <!-- 前3条特殊样式 -->
    {else}
        <!-- 第4条及以后全部统一样式 -->
    {/if}
{/eyou:list}

场景 2：第一条单独样式，2-5 条样式，6 条以后普通样式

{eyou:list titlelen='40' pagesize='12' infolen='50'}
    {if $i == 1}
        <!-- 第1条单独样式 -->
    {elseif $i <=5}
        <!-- 第2~5条样式 -->
    {else}
        <!-- 第6条之后 -->
    {/if}
{/eyou:list}

注意事项

1. $i 变量仅在 {eyou:list} 标签内部生效；
2. pagesize 控制列表读取总条数，判断数字不要超过 pagesize；
3. 修改模板后，后台清理 EyouCMS 缓存才能看到效果；
4. 样式代码直接写在 if 判断内部，CSS 类、HTML 结构都可以单独定义。