输出数据隔行变色

本文介绍了如何在网页中展示数据时实现隔行变色的效果,包括创建数据库表、在控制器中编写方法以及将数据传递到视图页面进行遍历输出。通过这种方法,可以提高数据可视化的清晰度。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

    //输出奇偶
    {volist name="data" id="val" mod='2'}
        {eq name='mod' value='0'} <p style="color: #2aabd2;">{$key}{$val.id}{$val.username}{$val.password}</p>{/eq}
        {eq name='mod' value='1'} <p style="color: #ffff00;">{$key}{$val.id}{$val.username}{$val.password}</p>{/eq}
    {/volist}


    //隔行变色
    {volist name='data' id='vo'}
        {if condition='$key % 2'}
            <p style="color: #2aabd2">{$key}{$vo.username}{$vo.password}</p>
            {else /}
            <p style="color: #2b542c">{$key}{$vo.username}{$vo.password}</p>
        {/if}
    {/volist}


    //隔多行换色
    {volist name='data' id='vo'}
        {php}
            $sw=$key%3;
        {/php}

        {switch name='sw'}
            {case value='0'}
                <p style="color: #2aabd2">{$key}{$vo.username}{$vo.password}</p>
            {/case}
            {case value='1'}
                <p style="color: #ffff00">{$key}{$vo.username}{$vo.password}</p>
            {/case}
            {case value='2'}
                <p style="color: #ff0000">{$key}{$vo.username}{$vo.password}</p>
            {/case}
        {/switch}

    {/volist}

    

    //多维数组输出

    1、创建数据表

        goods表:

           create table goods(

            id int unsigned auto_increment,

            name varchar(30) not null,

            pid int not null,

            price float not null,

            primary key(id));

        type表:

            create table type(

               id int unsigned auto_increment,

               name varchar(30) not null,

                primary key(id));

    2、在控制器中写入方法

$type=Db::table('type')->select();
foreach($type as $key => &$value){
    $value['goods']=Db::table('goods')->where("cid = $value[id]")->select();
}
dump($type);
$this->assign('type',$type);

    3、将数据分配到页面中

{volist name='type' id='vo'}
    <h2>{$vo.name}</h2>
    {volist name='vo.goods' id='val'}
        <p>{$val.name}{$val.price}</p>
    {/volist}
{/volist}


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值