图像数组在PHP / HTML中重复/复制

The problem is as shown in the image I've attached, my first day learning php and sql.

I want the images to be assigned to each particular item, so first item picture be displayed above the first item described rather than all 5 of them above each description. I'm still very new to this sorry. Thank you!

My code:

<?php
    $con = mysqli_connect("xxxx", "xxxx",
                     "xxxx", "xxxx");
    $query = "SELECT * FROM MyShop WHERE ID BETWEEN '1' AND '5'";
    $result = mysqli_query($con, $query);

    $array = array("cp.jpeg", "BV-C.jpeg", "BV-B.jpeg", "ADIY.jpeg", "CDG.jpeg",);

    while($person = mysqli_fetch_array($result)) {
    foreach( $array as $image ){
        echo "<img src='" . $image . "' height='200' width='200'/>";
    }
        echo "<center><h3>" . $person['Name'] . "</h3><center>";
        echo "<center><p>" . $person['Colour'] . "</p><center>";
        echo "<center><p class='ex'>" . $person['Description'] . "</p><center>";
        echo "<center><p> £" . $person['Price'] . "</p><center>";
}



?>

All five images are getting displayed first because your foreach loop closes after the img tag.

So it is printing each image, and then displaying your item information. Try this and see if it fixes your issue.

$count = 0;
while($person = mysqli_fetch_array($result)) {
    echo "<img src='" . $array[$count]. "' height='200' width='200'/>";
    echo "<center><h3>" . $person['Name'] . "</h3><center>";
    echo "<center><p>" . $person['Colour'] . "</p><center>";
    echo "<center><p class='ex'>" . $person['Description'] . "</p><center>";
    echo "<center><p> £" . $person['Price'] . "</p><center>";
    $count++;
}