Php 跨页面布局数据列表的最佳方法

我使用foreach循环返回PHP中的数据库结果，理想情况下，我希望将结果放在三列中

<?php 
foreach ($departments as $department) { ?>
    <br />
    <input type="checkbox" name="departments[]" 
       value="<?php echo $department->id; ?>">
    <label><?php echo $department->name; ?></label>
<?php 
} ?>

只需列出一个清单：）

HTML

<ul class="departments">
<?php foreach ($departments as $department) { ?>
    <li>
        <input type="checkbox" name="departments[]" value="<?php echo $department->id; ?>">
        <label><?php echo $department->name; ?></label>
    </li>
<?php } ?>
</ul>

参见此处示例：
列表或表格即可。桌子用

  <table>
  <tr>
  <?php foreach ($departments as $department): ?>
  <td>
  <input type="checkbox" name="departments[]" value="<?php echo $department->id; ?>">
  <label><?php echo $department->name; ?></label>
  </td>
  <?php endforeach; ?>
  </tr>
  </table>


表格并不是真正的解决方案。由于复选框的数量不是恒定的，如果不使用javascript开销来正确对齐复选框，就无法拥有固定的表结构。列表可能是一个很好的解决方案

更好的解决方案是将div与
float:left一起使用

<?php foreach($departments as $department) { ?>
    <div class="width-4">
        <input type="checkbox" name="departments[]" value="<?php echo $department->id; ?>" />
        <span><?php echo $department->name; ?></span>
    </div>
<?php } ?>
<div style="clear: both"></div>

如果要在宽度-4中添加填充、边距或边框，请小心。在这种情况下，您需要在
width-4
中使用另一个容器div，并向其添加填充、边框或边距

这种布局的优点是，在4个复选框之后，后续的复选框会自动移动到下一行。通过设置
width-4
TR的样式可以很容易地设置这些样式，TR必须在循环内，否则他可能会非常长TR。要么是循环，要么是
或者。。。这是你的个人选择我喜欢这个解决方案的想法非常简单，而且效果很好
<?php foreach($departments as $department) { ?>
    <div class="width-4">
        <input type="checkbox" name="departments[]" value="<?php echo $department->id; ?>" />
        <span><?php echo $department->name; ?></span>
    </div>
<?php } ?>
<div style="clear: both"></div>

.width-4 {
    width: 25%;
    float: left;
}