Question

我想在行中获得4个缩略图，但在下一个代码中，我将在一行中获得一个缩略图。如何在一行中获得4个缩略图，然后自动创建新行？

<div class="row">
    <div class="col-md-3 col-lg-3">
        <?php foreach($products as $product) : ?>
        <a href="#" class="thumbnail">
            <span class="label label-warning pull-right">TOP</span>
            <img src="<?php echo $this->basePath('img/placeholder.gif') ?>" alt="..."></img>
                <div class="caption">
                    <h3><?php echo $this->escapeHtml($product->title); ?></h3>
                    <p>
                    <?php echo $this->escapeHtml($product->description); ?>
                    <br>
                    Cena: <span class="label label-success"><?php echo $this->escapeHtml($product->price); ?></span>  
                    </p>
                    <p>
                    Lokalita: <span class="label label-info"><?php echo $this->escapeHtml($product->location); ?></span>
                    </p>
                </div>
        </a>

    <?php endforeach; ?>
</div>

Answer 1

你可以试试类似的东西（未经测试），使用$ count变量来存储目前为止的缩略图数量：

<?php 
$count = 0;
foreach($products as $product) : 

    // open a new row
    if (!$count%4)
        echo '<div class="row">
            <div class="col-md-3 col-lg-3">'
?>
<a href="#" class="thumbnail">
    XXXX
</a>
<?php
    // close row if there is 4 thumbnails in it
    if ($count%4 == 3)
        echo '</div></div>';

    $count++;
endforeach; 

// close the row at the end if the last one wasn't full
if ($count%4>0)
    echo '</div></div>';
?>

php中的Bootstrap自动生成行（网格系统）

1 个答案: