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

需求效果一行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动态读取数据清除最右边距的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

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

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

    需求效果一行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{ w

  • java使用JDBC动态创建数据表及SQL预处理的方法

    本文实例讲述了java使用JDBC动态创建数据表及SQL预处理的方法.分享给大家供大家参考,具体如下: 这两天由于公司的需求,客户需要自定义数据表的字段,导致每张表的字段都不是固定的而且很难有一个通用的模板去维护,所以就使用JDBC动态去创建数据表,然后通过表的字段动态添加数据,数据的来源主要是用户提供的Excel直接导入到数据库中. 如果考虑到字段的类型,可以通过反射的机制去获取,现在主要用户需求就是将数据导入到数据库提供查询功能,不能修改,所以就直接都使用String类型来处理数据更加便捷.

  • php从memcache读取数据再批量写入mysql的方法

    本文实例讲述了php从memcache读取数据再批量写入mysql的方法.分享给大家供大家参考.具体分析如下: 用 Memcache 可以缓解 php和数据库压力下面代码是解决高负载下数据库写入瓶颈问题,遇到最实用的:写入ip pv uv的时候,用户达到每分钟几万访问量,要记录这些数据,实时写入数据库必定奔溃. 用以下技术就能解决,还有如用户注册,同一时间断内,大量用户注册,可以缓存后一次性写入到数据库,代码如下: 复制代码 代码如下: public function cldata(){ $me

  • php从csv文件读取数据并输出到网页的方法

    本文实例讲述了php从csv文件读取数据并输出到网页的方法.分享给大家供大家参考.具体实现方法如下: <?php $fp = fopen('sample.csv','r') or die("can't open file"); print "<table>\n"; while($csv_line = fgetcsv($fp)) { print '<tr>'; for ($i = 0, $j = count($csv_line); $i

  • Highcharts使用简例及异步动态读取数据

    Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表,并且免费提供给个人学习.个人网站和非商业用途使用.HighCharts支持的图表类型有曲线图.区域图.柱状图.饼状图.散状点图和综合图表. 第一部分:在head之间加载两个JS库. <script src="html/js/jquery.js"></script> <script src="html/js/ch

  • 从Oracle数据库中读取数据自动生成INSERT语句的方法

    Oracle INSERT 语句 方法1 我估计有点 SQL 基础的人都会写 INSERT 语句.下面是 SQL 标准写法. INSERT INTO employees (employee_id, name) VALUES (1, 'Zhangsan'); INSERT INTO employees VALUES (1, 'Shangbo'); 方法2 其实, Oracle 还支持下面的写法,作用和上面的语句完全相同. INSERT INTO (SELECT employee_id, name

  • 动态读取JSON解析键值对的方法

    Json格式:{result:[{"aaa","111"},{"abc","121"},{"cba","212"}]} 复制代码 代码如下: function $$(id){return document.getElementById(id);} 复制代码 代码如下: function changelayer(id,oid){ $$(id).length=1; $.ajax({ type

  • layui动态渲染生成左侧3级菜单的方法(根据后台返回数据)

    声明:这里非常感谢闲心大神,开源了非常好用的前端UI框架,layui,如有侵权请联系我.当然闲心在2.0版本的layuiAdmin已经支持了,不过是收费版的,需要的同学可以自行购买,网址:http://www.layui.com/admin/pro/ 本人在做管理后台事用到了左侧的导航列表,但是管理后台进来的菜单是根据不同账户的权限,显示不同的菜单.这时候需要动态的渲染左侧的列表.但是1.0版本只是更新到2级菜单,不满足如下图的3级菜单需求,只能自己动手,改造源码 话不多说,上代码: 1.htm

  • Ajax读取数据之分页显示篇实现代码

    我觉得还是有必要把我的ajax分页呈现给大家．我先讲一下这个ajax分页的实现核心,然后我们再看实例效果．所谓的ajax分页与传统的数据分页,在服务端的代码基本上是一样的．我们主要做的是使用ajax在不刷新的情况下,将请求的页码,和每页要显示的条数发送给服务端的处理网页．大家点击这个网址就可以看到要请求的数据:"ajax_page.asp?action=read&pagecount=3 & current_page=1" 在这段URL里,pagecount代表每页要显示

  • Ajax初试之读取数据篇实现代码

    是的,今天我们要实现的效果是．在不刷新网页的情况下读取并显示服务端的数据． 拿出来我们上次准备好的东西． 1:XMLHTTPRequest对象的函数． 2:Asp输出xml格式的文件．你可以点击查看该文件内容 复制代码 代码如下: <% '出自:http://Www.Web666.Net '作者:康董 '如需转载请务必保留以上信息 '定义一个变量,来保存xml数据 dim xml xml = "<?xml version='1.0' encoding='gb2312'?><

随机推荐