css每行显示3列

Question

我正在学习用php编程，我每行显示3列时遇到问题。

现在输出：

 <?php

    $query = "SELECT * FROM DOCUMENTOS where EDUCATIVOS=1";
    $result = mysqli_query($conn,$query);

    while($row=mysqli_fetch_array($result)) {
      ?>
            <div class="row">
                <div class="col-sm-4 img-portfolio">
                    <a href="<?=$row['LINK_DOCUMENTOS'] ?>"">
                        <img class="img-responsive img-hover" src="<?=$row['LINK_IMAGEM'] ?>" alt=""> </a>
                        <h3><?=$row['NOME'] ?></h3>
                        <p><?=$row['DESCRICAO'] ?></p>

               </div>

        <?php   
        }
    ?>


   </div>

Answer 1

你必须在这里进行一些数学运算。使用像$counter这样的计数器变量来跟踪每行中打印的列数，并使用行 div 封装每三列 divs 。所以你的代码应该是这样的：

<?php
$query = "SELECT * FROM DOCUMENTOS where EDUCATIVOS=1";
$result = mysqli_query($conn,$query);

if(mysqli_num_rows($result)){
    $counter = 0;
    echo '<div class="row">';
    while($row=mysqli_fetch_array($result)) {
        if($counter != 0 && $counter % 3 == 0){
            echo '</div><div class="row">';
        }
    ?>
        <div class="col-sm-4 img-portfolio">
            <a href="<?=$row['LINK_DOCUMENTOS'] ?>"">
            <img class="img-responsive img-hover" src="<?=$row['LINK_IMAGEM'] ?>" alt=""> </a>
            <h3><?=$row['NOME'] ?></h3>
            <p><?=$row['DESCRICAO'] ?></p>
       </div>

    <?php   
        ++$counter;
    }
    echo '</div>';
}
?>