老板说：

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>练习</title>

<style>

    li{list-style: none;}

    .slide-content li{float:left;width: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()数组分割

php练习：每5个商品一排的更多相关文章

  1. ASP.NET之AdRotator实现淘宝浏览页面的商品随机推荐功能

    如今随便上个网都能够看到淘宝.京东等各大电商平台的双十一购物狂欢宣传,从2009年開始淘宝愣是把11.11这一天打造成了全民购物狂欢节.阿里巴巴的上市更是激发了阿里人的斗志,据说他们今年的目标是100 ...

  2. HTML5 CSS3 专题 ：诱人的实例 3D展示商品信息

    强化下perspective和transform:translateZ的用法.传统的商品展示或许并不能很好的吸引用户的注意力,但是如果在展示中添加适当的3D元素,~说不定效果不错哈~ 效果图: 说明一 ...

  3. vue+element 实现商品sku效果

    在网上搜索了很久,没有发现合适sku编辑的文章,只能自己写一个vue+element 的sku编辑功能.实现的效果如下图 除成本.售价.库存.货号这几个写死的属性外,可自行添加/删除商品属性,自行添加 ...

  4. 如何一步一步用DDD设计一个电商网站（四）—— 把商品卖给用户

    阅读目录 前言 怎么卖 领域服务的使用 回到现实 结语 一.前言 上篇中我们讲述了“把商品卖给用户”中的商品和用户的初步设计.现在把剩余的“卖”这个动作给做了.这里提醒一下,正常情况下,我们的每一步业 ...

  5. DDD 领域驱动设计-商品建模之路

    最近在做电商业务中,有关商品业务改版的一些东西,后端的架构设计采用现在很流行的微服务,有关微服务的简单概念: 微服务是一种架构风格,一个大型复杂软件应用由一个或多个微服务组成.系统中的各个微服务可被独 ...

  6. 【Machine Learning】决策树案例：基于python的商品购买能力预测系统

    决策树在商品购买能力预测案例中的算法实现 作者:白宁超 2016年12月24日22:05:42 摘要:随着机器学习和深度学习的热潮,各种图书层出不穷.然而多数是基础理论知识介绍,缺乏实现的深入理解.本 ...

  7. 电商系统中的商品模型的分析与设计—续

    前言     在<电商系统中的商品模型的分析与设计>中,对电商系统商品模型有一个粗浅的描述,后来有博友对货品和商品的区别以及属性有一些疑问.我也对此做一些研究,再次简单的对商品模型做一个介 ...

  8. Redis命令拾遗四（集合类型）—包含简单搜索筛选商品设计实例。

    本文版权,归博客园和作者吴双共同所有.转载和爬虫请注明博客园蜗牛Redis系列文章地址 http://www.cnblogs.com/tdws/tag/NoSql/ Redis数据类型之集合(Set) ...

  9. C#开发微信门户及应用(23)-微信小店商品管理接口的封装和测试

    在上篇<C#开发微信门户及应用(22)-微信小店的开发和使用>里面介绍了一些微信小店的基础知识,以及对应的对象模型,本篇继续微信小店的主题,介绍其中API接口的封装和测试使用.微信小店的相 ...

随机推荐

  1. HDU3987 Harry Potter and the Forbidden Forest（边数最少的最小割）

    方法1:两遍最大流.一遍最大流后,把满流边容量+1,非满流边改为INF:再求最小割即为答案. 我大概想了下证明:能构成最小割的边在第一次跑最大流时都满流,然后按那样改变边容量再求一次最小割,就相当于再 ...

  2. BZOJ1401 : Hexagon

    这题显然是一个最小斯坦纳树的模型,直接上模板即可,就是正六边形比较恶心. #include<cstdio> #include<cstring> #include<algo ...

  3. HDU 1242 (BFS搜索+优先队列)

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1242 题目大意:多个起点到一个终点,普通点耗时1,特殊点耗时2,求到达终点的最少耗时. 解题思路: ...

  4. Ruby Hash与ActiveSupport’s HashWithIndifferentAccess对于key的区别

    Ruby Hash的key定义的时候是支持symbol或者string的,所以访问的时候只能是symbol或者string其中一种方式. 建议使用symbol定义Hash的key,因为symbol在R ...

  5. Linux压力测试工具

    1 http_load:http://www.oschina.net/p/http_load 命令行输入man http_load 或者 http_load -h可以看到工具的使用方式: 参数说明: ...

  6. Eclipse @override报错解决

    第一种解决方案: @Override是JDK5 就已经有了,但有个小小的Bug,就是不支持对接口的实现,认为这不是Override 而JDK6 修正了这个Bug,无论是对父类的方法覆盖还是对接口的实现 ...

  7. QT快捷键

    F1使用方法:选中某一类或函数,按下F1,出现帮助文档 F2使用方法:选中某一类或函数,按下F2,迅速定位到该类或函数声明的地方或被调用的地方 Ctrl+鼠标滚轮的使用方法:按住Ctrl,使鼠标滚轮旋 ...

  8. Spring框架中的定时器 如何使用和配置

    目标类 <bean id="myTimer" class="com.timer.MyTimer"></bean> 配置你的定时器详情 & ...

  9. SPOJ 3267 D-query（离散化+主席树求区间内不同数的个数）

    DQUERY - D-query #sorting #tree English Vietnamese Given a sequence of n numbers a1, a2, ..., an and ...

  10. [ZZ] The Naked Truth About Anisotropic Filtering

    http://www.extremetech.com/computing/51994-the-naked-truth-about-anisotropic-filtering In the seemin ...