在帝国 CMS 的灵动标签中,我们可以通过判断索引值(即信息的序号)来为不同位置的内容添加不同样式。这在实现隔行变色、突出显示第一条 / 前几条信息等场景非常实用。

利用灵动标签自带的$bqno变量(从 1 开始的索引值)进行判断:
[e:loop={"select * from phome_ecms_news where checked=1 order by newstime desc limit 10",10,24,0}]
    <?php
    // 判断索引值并定义样式类
    if($bqno == 1){
        $style = "first-item"; // 第一条信息的样式
    } elseif($bqno % 2 == 0){
        $style = "even-item"; // 偶数条信息的样式
    } else {
        $style = "odd-item"; // 奇数条信息的样式
    }
    ?>
    <li class="news-item <?=$style?>">
        <span class="num"><?=$bqno?></span>
        <a href="<?=$bqsr['titleurl']?>" title="<?=$bqsr['title']?>"><?=esub($bqsr['title'],30)?></a>
    </li>
[/e:loop]

更复杂的样式判断示例

如果需要为前 3 条信息设置特殊样式,其余信息用默认样式:
[e:loop={"select * from phome_ecms_news where checked=1 order by newstime desc limit 10",10,24,0}]
    <?php
    // 初始化样式
    $itemClass = "normal-item";
    $titleStyle = "";
    
    // 根据索引设置不同样式
    if($bqno <= 3){
        $itemClass = "top-item";
        $titleStyle = "font-weight:bold;color:#f00;";
    } elseif($bqno == 4 || $bqno == 5){
        $itemClass = "secondary-item";
    }
    ?>
    <div class="list-item <?=$itemClass?>">
        <h3 style="<?=$titleStyle?>">
            <a href="<?=$bqsr['titleurl']?>"><?=esub($bqsr['title'],30)?></a>
        </h3>
        <?php if($bqno == 1): ?>
            <div class="featured-badge">推荐</div>
        <?php endif; ?>
    </div>
[/e:loop]

结合 CSS 的完整示例

先在 CSS 中定义样式:
/* 列表项样式 */
.news-list li {padding:8px 0;border-bottom:1px dashed #eee;}
.news-list li.first-item {background:#f9f9f9;padding:12px;border-left:3px solid #369;}
.news-list li.even-item {background:#f5f5f5;}
.news-list li.hot-item {color:#f00;}

然后在灵动标签中应用:
php
<ul class="news-list">
[e:loop={"select * from phome_ecms_news where checked=1 order by newstime desc limit 10",10,24,0}]
    <?php
    $class = '';
    if($bqno == 1) $class = 'first-item';
    elseif($bqno % 2 == 0) $class = 'even-item';
    // 假设第6条是热门信息
    if($bqno == 6) $class .= ' hot-item';
    ?>
    <li class="<?=$class?>">
        <a href="<?=$bqsr['titleurl']?>"><?=esub($bqsr['title'],30)?></a>
    </li>
[/e:loop]
</ul>

通过这种方式,你可以根据内容在列表中的位置(索引值)灵活设置不同的样式,实现更丰富的页面展示效果。$bqno变量是灵动标签自带的,无需额外定义即可直接使用。