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动态读取数据清除最右边距的更多相关文章
- Highcharts使用简例 + 异步动态读取数据
第一部分:在head之间加载两个JS库. <script src="html/js/jquery.js"></script> <script src= ...
- ASP.NET&AJAX&JSON - 动态读取数据
因为之前帮WM组做了一个delivery的dashboard,大概用了3周的时间,.net也忘了差不多了,ajax和highchart表也是现学的,蛮费劲!总算也搞出来了.发帖纪录一下. 1. 前台A ...
- TabTopAutoTextSizeLayout【自定义文字字号区域（动态选项卡数据且可滑动）】
版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 自定义顶部选项卡布局LinearLayout类,实现可滑动效果.[实际情况中建议使用RecyclerView] 对<TabTo ...
- 自己动手之使用反射和泛型，动态读取XML创建类实例并赋值
前言: 最近小匹夫参与的游戏项目到了需要读取数据的阶段了,那么觉得自己业余时间也该实践下数据相关的内容.那么从哪入手呢?因为用的是Unity3d的游戏引擎,思来想去就选择了C#读取XML文件这个小功能 ...
- Unity3D移动平台动态读取外部文件全解析
前言: 一直有个想法,就是把工作中遇到的坑通过自己的深挖,总结成一套相同问题的解决方案供各位同行拍砖探讨.眼瞅着2015年第一个工作日就要来到了,小匹夫也休息的差不多了,寻思着也该写点东西活动活动大脑 ...
- 用EXCEL内嵌的Visual Basic for Application 编程，通过 UGSimple USB-GPIB 控制器来驱动仪器34401A，并从34401A读取数据
现在市场上有很多中USB-GPIB 控制器,或叫 USB 转GPIB链接线. 每种GPIB控制器都有它的 函数库(dll库).各种GPIB 控制器的价钱插别很大.这里以一种价钱较便宜的USB-GPIB ...
- 使用CHttpFile从服务器端正确的读取数据
前段时间在给软件做升级提示模块的时候发现一个问题,就是使用CHttpFile对象无法从服务器端获取到正确的响应数据长度,无论是使用CHttpFile:: QueryInfo方法,还是使用CHttpFi ...
- 【转】基本数据持久性(一) 使用plist保存和读取数据
原文网址:http://www.it165.net/pro/html/201309/7170.html 想保存成绩.记录得分.保存账号密码等等?数据持久性可以做到这一点!这篇文章通过简单的程序,来分享 ...
- C#下如何用NPlot绘制期货股票K线图(2):读取数据文件让K线图自动更新
[内容介绍]上一篇介绍了K线图的基本绘制方法,但很不完善,本篇增加了它直接读取数据的功能,这对于金融市场的数据量大且又需要动态刷新功能的实现很重要. [实现方法] 1.需要一个数据文件,这里用的是直接 ...
随机推荐
- HDU3729 I'm Telling the Truth（字典序最大的最大流）
题目大概说n个学生,都各自有一个互不相同的成绩排名,他们各自说了他们成绩排名所在区间,问最多有几个学生没说谎以及字典序最大的没说谎的学生序列. 学生作为一个X部的点,排名作为Y部的点,学生与其成绩排名 ...
- ZOJ2770 Burn the Linked Camp（差分约束系统）
区间和一定要联系到前缀和. 这题,把前缀和看作点,从s0到sn: 对于每一个营地i的容量capi,有这么个关系si-si-1<=capi: 对于每一个区间的评估i,j,k,有sj-si-1> ...
- White Rectangles[HDU1510]
White Rectangles Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) ...
- BZOJ3746 : [POI2015]Czarnoksiężnicy okrągłego stołu
NOIP前做了几道POI,现在终于能在BZOJ上提交了… 交上去最后几个点WA,看了数据发现p=0的特判错了… p=0,1时特判 p=2时构造两种情况判断 p=3时不考虑1的座位进行DP 可以发现对于 ...
- NOI2011阿狸的打字机（fail树+DFS序）
Description 阿狸喜欢收藏各种稀奇古怪的东西,最近他淘到一台老式的打字机.打字机上只有28个按键,分别印有26个小写英文字母和'B'.'P'两个字母. 经阿狸研究发现,这个打字机是这样工作的 ...
- ckeditor的详细配置
CKEditor 3 JavaScript API Documentation : http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.con ...
- Java主要有那几种文件类型，各自作用
java提供了两类数据类型:基本类型,引用类型. 1.基本类型包括:boolean ,byte,char,int,short,float,long,double,值得注意的是:在原始数据类型中,除了b ...
- jq实现多banner效果图
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title&g ...
- 新浪微博API开放平台进行程序开发第一步（java）
申请开发者权限步骤: 1.登录sina微博,点击“应用” 2.点击“微博开发平台 我也要做开发者” 3.点击“我的应用”,填写“开发者信息” 4.点击“创建应用”,就是你将要开发的微博应用程序,可以是 ...
- dig理解DNS的解析过程 - 阿权的书房
关于DNS的常识,可以阅读附录的一些参考资料.本文旨在尝试举例用dig命令理解这个过程,并非权威知识,仅供参考.测试域名为阿权的书房的域名 www.aslibra.com 和 www.163.com. ...