在一行上得到6张照片


getting 6 pics on one line

我正在尝试多行图片,每行有6张图片。目前每行有4张照片,我不知道如何制作,所以我有6张。如有任何帮助,我们将不胜感激!

这是我的代码:

<?php 
$pageTitle = "Bright Punch Love";
$section = "home";
include('inc/products.php');
?>
<?php include('inc/header.php'); ?>
<div id="top"><img src="top.png" width="1337"></div>
<div class="shirts">
    <ul class= "shirts-section">
        <?php
        foreach($products as $product_id => $product) { 
            echo "<li>";
            echo '<a href="shirt.php?id=' . $product_id . '">';
            echo '<img src="' . $product["img"] . '" width= 200 alt="' . $product["name"] . '">';
            echo '<p id="details">$30 View Details</p>';
            echo "</a>";
            echo "</li>";
        }   
        ?>
    </ul>
</div>
<?php include('inc/footer.php'); ?>
<div id="bottom-index"><img src="bottom-index.png" width="1337"></div>

我建议使用%而不是px。您还可以使用width标记。尽量避免在html代码中使用css。请改用class="...",并将css文件包含在head标记中。我现在把文件记在脑子里,因为它对你来说更容易。但我建议您只为css创建一个文件。

<head>
    <style type="text/css">
        .picture{
            width : 15%;
        }
    </style>
</head>
echo '<img src="' . $product["img"] . '" class='"picture'" alt="' . $product["name"] . '">';

使用PHP的array_chunk函数缩短答案。试试看。

$products_new = array_chunk($products, 6);
foreach($products_new as $product_id => $product) {
//Your code
}