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 清除网页病毒的方法
Dec 05 PHP
PHP表单递交控件名称含有点号(.)会被转化为下划线(_)的处理方法
Jan 06 PHP
使用php get_headers 判断URL是否有效的解决办法
Apr 27 PHP
yii实现级联下拉菜单的方法
Jul 31 PHP
ThinkPHP调试模式与日志记录概述
Aug 22 PHP
php求一个网段开始与结束IP地址的方法
Jul 09 PHP
项目中应用Redis+Php的场景
May 22 PHP
Yii2使用dropdownlist实现地区三级联动功能的方法
Jul 18 PHP
php实现留言板功能
Mar 05 PHP
PDO::exec讲解
Jan 28 PHP
php生成微信红包数组的方法
Sep 05 PHP
Thinkphp5.0框架使用模型Model的获取器、修改器、软删除数据操作示例
Oct 11 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
天使彦史上最神还原,性别曝光的那一刻,百万网友恋爱了
2020/03/02 国漫
php文件怎么打开 如何执行php文件
2011/12/21 PHP
ThinkPHP访问不存在的模块跳转到404页面的方法
2014/06/19 PHP
php输出图像的方法实例分析
2017/02/16 PHP
Laravel框架在本地虚拟机快速安装的方法详解
2018/06/11 PHP
重定向实现代码
2006/11/20 Javascript
仅用[]()+!等符号就足以实现几乎任意Javascript代码
2010/03/01 Javascript
js模拟点击以提交表单为例兼容主流浏览器
2013/11/29 Javascript
Firefox下无法正常显示年份的解决方法
2014/09/04 Javascript
Jquery 实现grid绑定模板
2015/01/28 Javascript
JavaScript中模拟实现jsonp
2015/06/19 Javascript
Bootstrap每天必学之js插件
2015/11/30 Javascript
jquery中object对象循环遍历的方法
2015/12/18 Javascript
简介BootStrap model弹出框的使用
2016/04/27 Javascript
Bootstrap框架下下拉框select搜索功能
2020/03/26 Javascript
基于HTML5+JS实现本地图片裁剪并上传功能
2017/03/24 Javascript
详解Vue 动态添加模板的几种方法
2017/04/25 Javascript
Angularjs 双向绑定时字符串的转换成数字类型的问题
2017/06/12 Javascript
基于vue中对鼠标划过事件的处理方式详解
2018/08/22 Javascript
微信小程序视图控件与bindtap之间的问题的解决
2019/04/08 Javascript
详解ES6新增字符串扩张方法includes()、startsWith()、endsWith()
2020/05/12 Javascript
Node.js API详解之 repl模块用法实例分析
2020/05/25 Javascript
Python使用reportlab将目录下所有的文本文件打印成pdf的方法
2015/05/20 Python
Python列表list操作符实例分析【标准类型操作符、切片、连接字符、列表解析、重复操作等】
2017/07/24 Python
python读取中文txt文本的方法
2018/04/12 Python
python实现扫雷游戏的示例
2020/10/20 Python
Interhome丹麦:在线预订度假屋和公寓
2019/07/18 全球购物
Ruby如何实现动态方法调用
2012/11/18 面试题
护士自我鉴定总结
2014/03/24 职场文书
新年寄语大全
2014/04/12 职场文书
宣传工作经验材料
2014/06/02 职场文书
文明城市标语
2014/06/16 职场文书
趣味运动会赞词
2015/07/22 职场文书
2016秋季运动会前导词
2015/11/25 职场文书
在前女友婚礼上,用Python破解了现场的WIFI还把名称改成了
2021/05/28 Python
深入理解go slice结构
2021/09/15 Golang