php - 跨页面布局数据列表的最佳方式

Question

我在理想情况下使用 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 表格或 CSS？将其合并到 PHP foreach 循环中的最佳方法是什么？

Answer 1

表格并不是真正的解决方案。由于复选框的数量不是恒定的，如果不使用 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>

这里，width-4 是帮助对齐复选框的 div。 CSS 如下。

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

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

这种布局的优点是在 4 个复选框之后，后续的复选框会自动移动到下一行。这些可以通过 width-4 样式轻松设置样式。