php动态读取数据清除最右边距的方法


Posted in PHP onApril 12, 2017

需求效果一行3栏:

php动态读取数据清除最右边距的方法

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

<!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>

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

php动态读取数据清除最右边距的方法

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

<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动态读取数据清除最右边距的方法

解决方案二: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动态读取数据清除最右边距的方法

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

以上这篇php动态读取数据清除最右边距的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
PHP中GET变量的使用
Oct 09 PHP
PHP用mysql数据库存储session的代码
Mar 05 PHP
php access 数据连接与读取保存编辑数据的实现代码
May 12 PHP
ThinkPHP查询中的魔术方法简述
Jun 25 PHP
ThinkPHP实现一键清除缓存方法
Jun 26 PHP
完美实现wordpress禁止文章修订和自动保存的方法
Nov 03 PHP
详解thinkphp实现excel数据的导入导出(附完整案例)
Dec 29 PHP
php检测mysql表是否存在的方法小结
Jul 20 PHP
PHP substr()函数参数解释及用法讲解
Nov 23 PHP
PHP实现求连续子数组最大和问题2种解决方法
Dec 26 PHP
PDO::beginTransaction讲解
Jan 27 PHP
laravel 获取某个查询的查询SQL语句方法
Oct 12 PHP
详解使用php调用微信接口上传永久素材
Apr 11 #PHP
php array_reverse 以相反的顺序返回数组实例代码
Apr 11 #PHP
PHP和MYSQL实现分页导航思路详解
Apr 11 #PHP
php 一维数组的循环遍历实现代码
Apr 10 #PHP
删除PHP数组中的重复元素的实现代码
Apr 10 #PHP
删除PHP数组中头部、尾部、任意元素的实现代码
Apr 10 #PHP
PHP数组中头部和尾部添加元素的方法(array_unshift,array_push)
Apr 10 #PHP
You might like
linux下使用ThinkPHP需要注意大小写导致的问题
2011/08/02 PHP
php object转数组示例
2014/01/15 PHP
PHP学习笔记(二):变量详解
2015/04/17 PHP
php插件Xajax使用方法详解
2017/08/31 PHP
PHP实现的操作数组类库定义与用法示例
2019/05/24 PHP
懒就要懒到底——鼠标自动点击(含时间判断)
2007/02/20 Javascript
Javascript 浮点运算的问题分析与解决方法
2013/08/27 Javascript
基于jQuery实现二级下拉菜单效果
2016/02/01 Javascript
jquery实现网页定位导航
2016/08/23 Javascript
JavaScript自定义函数实现查找两个字符串最长公共子串的方法
2016/11/24 Javascript
JQuery实现图片轮播效果
2017/05/08 jQuery
jQuery实现图片简单轮播功能示例
2018/08/13 jQuery
JS打印彩色菱形的实例代码
2018/08/15 Javascript
Node.js JSON模块用法实例分析
2019/01/04 Javascript
vue双向绑定及观察者模式详解
2019/03/19 Javascript
vuejs中父子组件之间通信方法实例详解
2020/01/17 Javascript
react实现复选框全选和反选组件效果
2020/08/25 Javascript
Python中的闭包总结
2014/09/18 Python
Python新手们容易犯的几个错误总结
2017/04/01 Python
Python实现翻转数组功能示例
2018/01/12 Python
浅谈Python3 numpy.ptp()最大值与最小值的差
2019/08/24 Python
安装多个版本的TensorFlow的方法步骤
2020/04/21 Python
python实现跨年表白神器--你值得拥有
2021/01/04 Python
python 批量将中文名转换为拼音
2021/02/07 Python
网购亚洲时装、美容产品和生活百货:YesStyle
2016/09/15 全球购物
澳大利亚最好的电动自行车:Leon Cycle
2020/12/19 全球购物
自行车租赁公司创业计划书
2014/01/28 职场文书
协议书的格式
2014/04/23 职场文书
彩色的翅膀教学反思
2014/04/25 职场文书
考研英语辞职信
2015/05/13 职场文书
教师培训简讯
2015/07/20 职场文书
采购部年度工作总结
2015/08/13 职场文书
2016高中社会实践心得体会范文
2016/01/14 职场文书
初一语文教学反思
2016/03/03 职场文书
CSS极坐标的实例代码
2021/06/03 HTML / CSS
Elasticsearch6.2服务器升配后的bug(避坑指南)
2022/09/23 Servers