PHP控制div块大小和颜色的例子

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

网站为了设计的更好看，会有很多的样式，而用php来控制样式很常见，无聊写了一个可以用于列表展示的样式，不喜忽喷。

1、先添加一个style样式控制div默认不换行

2、然后输入PHP代码

<?php$arr = array(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20);foreach($arr as $key => $val){ $j = 1; if($key % 10 >3){ $j = 2; } if($key%10 == 4 || $key%10 == 0){ echo "<br>"; } if($j == 2){ if($key%10 == 0 || $key%10 ==1){ if($key%2!=0){ echo "<div style=\"width:20px;height:20px;background-color:#2864bb;\"></div>"; }else{ echo "<div style=\"width:20px;height:20px;background-color:#7ea2d6;\"></div>"; } }else{ if($key%2!=0){ echo "<div style=\"width:20px;height:20px;background-color:#2864bb;\"></div>"; }else{ echo "<div style=\"width:20px;height:20px;background-color:#7ea2d6;\"></div>"; } } }else{ if($key%10 == 0 || $key%10 ==1){ if($key%2==0){ echo "<div style=\"width:40px;height:20px;background-color:#2864bb;\"></div>"; }else{ echo "<div style=\"width:40px;height:20px;background-color:#7ea2d6;\"></div>"; } }else{ if($key%2==0){ echo "<div style=\"width:20px;height:20px;background-color:#2864bb;\"></div>"; }else{ echo "<div style=\"width:20px;height:20px;background-color:#7ea2d6;\"></div>"; } } }}?>

然后打印出来的效果是如下的图片，每一个颜色块都是一个div块，第一个和第二个为长方形，第三个和第四个是正方形，颜色从偶数行开始颜色的排列和奇数行相反。