zoukankan      html  css  js  c++  java
  • php练习:每5个商品一排

    老板说:

    我要一行5个商品,每个长得都不一样

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>练习</title>
    <style>
        li{list-style: none;}
        .slide-content li{float:left;100px;height:100px;border:1px solid #000;margin:5px;line-height: 100px;color:#000;text-align: center;}
        .li-1{background:red;}
        .li-2{background:yellow;}
        .li-3{background:blue;}
        .li-4{background:green;}
        .li-5{background:gray;}
    </style>
    </head>
    <body>
    
    <?php
    //商品组至少5个噢
    $items=array(
        array("name"=>"product1","price"=>10),
        array("name"=>"product2","price"=>20),
        array("name"=>"product3","price"=>30),
        array("name"=>"product4","price"=>40),
        array("name"=>"product5","price"=>10)
    );
    //一行显示5个
    
        $li_n=5;
        //宝贝数
        $p_num=count($items)+1;    
        //循环的ul数,cei(1.5)=2
        $ul_n=ceil($p_num/$li_n);    
    for($i=1;$i<$ul_n;$i++){    
        $li_nav=1;    
        echo '<ul class="slide-content">';
                foreach($items as $key => $item){
    
                    /*listart*/
                    $s_n=$key+1;
                    $end_q=$i*$li_n;
                    $star_q=$end_q-$li_n;
    
                    /*1-5,5-10,10-15等,li_nav每次从1开始*/
                    if($s_n>$star_q and $s_n<=$end_q){
                        echo '<li class="li-'.$li_nav.'">'.$item['name'].'</li>';
                        $li_nav++;
                    }    
                    /*liend*/
                }    
    echo '</ul>';
        }
    ?>
    
    
    </body>
    </html>

     

    但是,我不会告诉你我有更好的方法>>使用array_chunk()数组分割

  • 相关阅读:
    GPS时间服务器在广电系统的应用
    时钟系统报价分析
    北斗校时服务器装置介绍
    时钟服务器的安装与调试
    频率计使用说明
    通用计数器使用方法
    WOL持久化配置
    RGB屏驱动流程
    iOS-苹果登陆授权(AppleID SignIn)
    VSCODE自用快捷键备忘
  • 原文地址:https://www.cnblogs.com/tinyphp/p/5661105.html
Copyright © 2011-2022 走看看