循环中的图像与PHP中的不同div类

时间:2012-09-26 14:35:04

标签: php html css loops

假设我有像bellow

这样的代码
<?php 
$sql = "SELECT * FROM images";
$query = mysql_query($sql);

while($row = mysql_fetch_assoc($query)) {
    echo '<div class="single">';
    echo '<img src="'.$row['image'].'" alt="'.$row['title'].' " />';
    echo '</div>';
} 
?>

我希望在每组5张图片中将firstlast添加到div class <div class="single">中,即

<div class="single first">
    <img src="image1.jpg" alt="title1" />
</div>

<div class="single">
    <img src="image2.jpg" alt="title2" />
</div>

<div class="single">
    <img src="image3.jpg" alt="title3" />
</div>

<div class="single">
    <img src="image4.jpg" alt="title4" />
</div>

<div class="single last">
    <img src="image5.jpg" alt="title5" />
</div>

如何通过循环完成,请帮助,

谢谢:)

4 个答案:

答案 0 :(得分:5)

使用modulo

<?php 
$sql = "SELECT * FROM images";
$query = mysql_query($sql);

$i = 0;
$class = "";

while($row = mysql_fetch_assoc($query)) {

    if($i % 5 == 0){
        $class = 'first';
    }else if($i % 5 == 4){
        $class = 'last';
    }else{
        $class = "";
    }

    echo '<div class="single ' . $class . '">';
    echo '<img src="'.$row['image'].'" alt="'.$row['title'].' " />';
    echo '</div>';

    $i++;
} 
?>

答案 1 :(得分:2)

<?php 
$sql = "SELECT * FROM images";
$query = mysql_query($sql);

$x=0; 
while($row = mysql_fetch_assoc($query)) {
    $x++;
    if ( $x == 1 ) { $c = ' first'; } 
        elseif ( $x == 5 ) { $c = ' last'; }
        else { $c = ''; }

    echo '<div class="single' . $c . '">';
    echo '<img src="'.$row['image'].'" alt="'.$row['title'].' " />';
    echo '</div>';
} 
?>

答案 2 :(得分:1)

这个怎么样:

$index = 0;
while($row = mysql_fetch_assoc($query)) {
    $classes = 'single';
    switch ($index % 5) {
      case 0:
        $classes .= ' first';
        break;
      case 4:
        $classes .= ' last';            
        break;
    }
    echo <<<HTML
<div class="$classes">
  <img src="{$row['image']}" alt="{$row['title']}" />
</div>;
HTML;

    $index++;
}

作为旁注,您是否考虑过使用CSS nth-child属性?

答案 3 :(得分:1)

您需要计算迭代次数,并使用模数函数来获取5的部分:

$sql = "SELECT * FROM images";
$query = mysql_query($sql);

$i = 0;
while($row = mysql_fetch_assoc($query)) {
    if($i % 5 == 0)
      echo '<div class="single first">';
    else if($i % 5 == 4) 
      echo '<div class="single last">';
    else
      echo '<div class="single">';
    echo '<img src="'.$row['image'].'" alt="'.$row['title'].' " />';
    echo '</div>';
    $i++;
}