使用PHP foreach结合W3.CSS生成三等分多行列并填充数据库数据

完全可以实现该需求，你现有代码运行不符合预期的核心原因是嵌套了两层冗余的foreach循环，且将w3-row行容器写在了错误的循环层级，导致每生成一个列就重复创建行容器。

推荐使用array_chunk()函数实现，逻辑清晰不易出错：

步骤1：准备数据（模拟数据库查询结果） #

// 实际使用时替换为你的数据库查询逻辑，比如PDO/mysqli查询返回的结果集
$products = [
    ['name' => 'Item 1 from a database'],
    ['name' => 'Item 2 from a database'],
    ['name' => 'Item 3 from a database'],
    ['name' => 'Item 4 from a database'],
    ['name' => 'Item 5 from a database'],
    ['name' => 'Item 6 from a database'],
    ['name' => 'Item 7 from a database']
];

// 按每3个元素为一组拆分数组，每组对应一行三等分列
$productRows = array_chunk($products, 3);

步骤2：渲染布局 #

<?php foreach ($productRows as $row) : ?>
<div class="w3-row">
    <?php foreach ($row as $product) : ?>
    <div class="w3-third w3-container">
        <h2><?php echo htmlspecialchars($product['name']); ?></h2>
        <!-- 可扩展添加产品图片、价格、描述等其他字段的渲染逻辑 -->
    </div>
    <?php endforeach; ?>
</div>
<?php endforeach; ?>

该写法生成的DOM结构和你期望的完全一致，就算最后一行产品数量不足3个也能正常渲染，不会生成多余的空列。

内容的提问来源于stack exchange，提问作者Terence Chew