需求效果一行3栏：

场景模拟：同事给了我这么一段静态代码如下:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<style>

    li,ul{padding: 0;margin:0;list-style: none;}

    .box{

        width:1000px;background: #ddd;height:500px;

    }

    .box li{margin:0 50px 20px 0;background:red;height:30px;width:300px;float: left;}

</style>

<body>

    <div class="box">

        <ul>

            <?php

            for($i=0;$i<9;$i++){

                    echo '<li></li>';

            }

            ?>

        </ul>

    </div>

</body>

</html>

可是动态读取是统一的呀？宽度不够咋办捏？错误的换行效果并不是我们想要的!

解决方案一：样式加宽隐藏

<style>

    li,ul{padding: 0;margin:0;list-style: none;}

    .box{

        width:1000px;background: #ddd;height:500px;overflow: hidden;

    }

    .box ul{width: 1200px;}

    .box li{margin:0 50px 20px 0;background:red;height:30px;width:300px;float: left;}

</style>

预览正常：

解决方案二：php判断，清除最右栏边距

    <div class="box">

        <ul>

            <?php

            //列数

            $col=3;

            for($i=0;$i<9;$i++){

                $margin_r = (($i%$col)==($col-1))?"margin-right:0;":"";//清除每行最右侧宝贝右边距

                    echo '<li style="'.$margin_r.'">'.$i%$col.'</li>';

            }

            ?>

        </ul>

    </div>

方案一和方案二都是可以实现一样的效果！

php动态读取数据清除最右边距的更多相关文章

  1. Highcharts使用简例 + 异步动态读取数据

    第一部分:在head之间加载两个JS库. <script src="html/js/jquery.js"></script> <script src= ...

  2. ASP.NET&AJAX&JSON - 动态读取数据

    因为之前帮WM组做了一个delivery的dashboard,大概用了3周的时间,.net也忘了差不多了,ajax和highchart表也是现学的,蛮费劲!总算也搞出来了.发帖纪录一下. 1. 前台A ...

  3. TabTopAutoTextSizeLayout【自定义文字字号区域（动态选项卡数据且可滑动）】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 自定义顶部选项卡布局LinearLayout类,实现可滑动效果.[实际情况中建议使用RecyclerView] 对<TabTo ...

  4. 自己动手之使用反射和泛型，动态读取XML创建类实例并赋值

    前言: 最近小匹夫参与的游戏项目到了需要读取数据的阶段了,那么觉得自己业余时间也该实践下数据相关的内容.那么从哪入手呢?因为用的是Unity3d的游戏引擎,思来想去就选择了C#读取XML文件这个小功能 ...

  5. Unity3D移动平台动态读取外部文件全解析

    前言: 一直有个想法,就是把工作中遇到的坑通过自己的深挖,总结成一套相同问题的解决方案供各位同行拍砖探讨.眼瞅着2015年第一个工作日就要来到了,小匹夫也休息的差不多了,寻思着也该写点东西活动活动大脑 ...

  6. 用EXCEL内嵌的Visual Basic for Application 编程，通过 UGSimple USB-GPIB 控制器来驱动仪器34401A，并从34401A读取数据

    现在市场上有很多中USB-GPIB 控制器,或叫 USB 转GPIB链接线. 每种GPIB控制器都有它的 函数库(dll库).各种GPIB 控制器的价钱插别很大.这里以一种价钱较便宜的USB-GPIB ...

  7. 使用CHttpFile从服务器端正确的读取数据

    前段时间在给软件做升级提示模块的时候发现一个问题,就是使用CHttpFile对象无法从服务器端获取到正确的响应数据长度,无论是使用CHttpFile:: QueryInfo方法,还是使用CHttpFi ...

  8. 【转】基本数据持久性(一) 使用plist保存和读取数据

    原文网址:http://www.it165.net/pro/html/201309/7170.html 想保存成绩.记录得分.保存账号密码等等?数据持久性可以做到这一点!这篇文章通过简单的程序,来分享 ...

  9. C#下如何用NPlot绘制期货股票K线图(2):读取数据文件让K线图自动更新

    [内容介绍]上一篇介绍了K线图的基本绘制方法,但很不完善,本篇增加了它直接读取数据的功能,这对于金融市场的数据量大且又需要动态刷新功能的实现很重要. [实现方法] 1.需要一个数据文件,这里用的是直接 ...

随机推荐

  1. Pebbles

    Pebbles Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Sub ...

  2. HNOI2015

    终于把湖南省的省选题切了(贵省真是厉害). T1 http://www.cnblogs.com/wzj-is-a-juruo/p/5228858.html T2 http://www.cnblogs. ...

  3. java面试题中常见的关于String类问题总结

    问题1: String s1 = “abc”;String s2 = “abc”;System.out.println(s1 == s2); 这里的结果是true. 由于字符串是常量(内存中创建对象后 ...

  4. iOS完整学习步骤

    一  C语言 1.1基本数据类型和基本运算 1.2 函数 数组 字符串 指针 1.3 预处理指令 1.4结构体 枚举 1.5 文件操作 内存管理 二 Objective - C 2.1 面向对象 2. ...

  5. Qt 5.4 OpenCV 2.4.11 Win 32 Configuration

    Download CMake 2.8.2 Download OpenCV 2.4.11 Download Qt 5.4 Highly improtant note: The installation ...

  6. 如何使用数据库保存session的方法简介

    使用数据库保存session的方法 php的session默认是以文件方式保存在服务器端,并且在客户端使用cookie保存变量,这就会出现一个问题,当一个用户由于某种安全原因关闭了浏览器的cookie ...

  7. 是否采用Sybase形式的自动字符串转义(用 '' 表示 '）

    ;; 关于php.ini ;; ; 这个文件必须命名为'php.ini'并放置在httpd.conf中PHPINIDir指令指定的目录中. ; 最新版本的php.ini可以在下面两个位置查看: ; h ...

  8. Reset RequiredFieldValidator 重置 验证控件

    <td style="width:100px;">姓名<span class="must_star">*</span>< ...

  9. JS页面跳转 神器！ window.href window.open

    window.open 打开页面, 网址为新的网址 window.href 为打开本网址的链接, 为网站URL+传入的URL

  10. PHP / JavaScript / jQuery 表单验证与处理总结： 第①部分 PHP 表单验证与处理

    PHP VERSION = 5.3.10 一.关于 $_REQUEST PHP 文档关于 $_REQUEST 的说明: 说明 默认情况下包含了 $_GET,$_POST 和 $_COOKIE 的数组. ...