使用表和while循环在大图像下显示较小的图像

Question

我将尝试使其变得简单（不允许上传图片）。 这是我的代码。 我希望第一个图像显示为大图像，较小的图像在下面一个接一个显示。 我将附上CSS和php。 现在，图像显示如下：大，小，大，小，大..等...

PHP

 // Get image
         $sqlimg= "SELECT * FROM images where Horse_ID='$hid'";   
        $resultimg = $conn->query($sqlimg);

       // $rowimg = $resultimg->fetch_assoc();       

        $a = 1;
    // Start table
    echo "<table id='horses'>";

    while($rowimg = mysqli_fetch_assoc($resultimg)){    
    if($a <= 1){ //number of cells in row  

    // Big Image
    ?>
    <tr>
    <td id="big">
    <a href="uploads/<?php echo $rowimg['imageName'];?>" data-lightbox="image-1">
    <img src="uploads/<?php echo $rowimg['imageName'];?> " />
    </td></tr><tr>


    <?php
    $a++;
    }    
    else {

    // second row
    ?>   
    <tr>

    <td id="small">
    <a href="uploads/<?php echo $rowimg['imageName'];?>" data-lightbox="image-1">
    <img src="uploads/<?php echo $rowimg['imageName'];?> " />
    </td></tr>

    <?php
    $a = 1; 
        }
    }
    echo "</table>";

CSS

#display table
{
padding:80px 0px 0px 0px;
margin:0px auto;
}

#display table td#small img
{
height:50px;
}

#display table td#big img
{
height:200px;
}

Answer 1

每次输出小图像时，您都将$ a重置为1。 这将导致下一个图像输出很大。 您可能只想在每次输出图像时增加$ a。 摆脱$ a = 1代替else块，然后将$ a ++移至if / else块之外。

// Get image
$sqlimg= "SELECT * FROM images where Horse_ID='$hid'";   
$resultimg = $conn->query($sqlimg);

$a = 1;
// Start table
echo "<table id='horses'>";

while($rowimg = mysqli_fetch_assoc($resultimg)){    
  if($a <= 1){ //number of cells in row  

  // Big Image
?>

  <tr>
    <td id="big">
      <a href="uploads/<?php echo $rowimg['imageName'];?>" data-lightbox="image-1">
        <img src="uploads/<?php echo $rowimg['imageName'];?> " />
      </a>
    </td>
  </tr>

<?php
  }    
  else {

  // second row
?>   

  <tr>
    <td id="small">
      <a href="uploads/<?php echo $rowimg['imageName'];?>" data-lightbox="image-1">
        <img src="uploads/<?php echo $rowimg['imageName'];?> " />
      </a>
    </td>
  </tr>

<?php
  }
  $a++;
}
echo "</table>";