Question

我正在用PHP创建一个电子商务商店，我的PHP代码工作正常，但我的产品是垂直排列的，我希望它们水平排列。

我试过浮动：左，显示：内联......但它不起作用

我想在同一条线上看到4种产品。

我的PHP代码（忽略语言）

<?php
  $consulta = mysql_query("SELECT * 
                           FROM  `livros-desporto` ");

     if(isset($_POST['buscar'])){
    $consulta = mysql_query("SELECT * 
                             FROM `livros-desporto`
                             where name like '%".$_POST['buscar']."%'");
     }

      while ($linha = mysql_fetch_array($consulta))  
      {
          $id = $linha['ID'];
          $modelo = $linha['Model'];
          $nome = $linha['Name'];
          $categoria = $linha['Category'];
          $imagem = $linha['Image'];
          $manufactura = $linha['Manufacturer'];
          $preco = $linha['Price'];
          $quantidade = $linha['quantity']
         // $adicionar = '<a href="carrinho.php?id='.$linha['ID']
             //.'"title="'.$linha['ID'].'">
        //  Adicionar </a>'   
   ?>

我的HTML代码

<div class="fade1">

<div class="produtos">

<li>            
    <p><?php echo $nome ?></p>
    <p><?php echo $imagem ?></p>
    <p><?php echo $categoria ?></p>
</li>

</div>
</div>
</div>

<?php
      }

  ?>

由于

Answer 1

display:inline-block;

可用于水平显示div或li个元素。如果您创建一个固定宽度的容器，并且您的产品容器大约是该宽度的1/4，那么它们应该在每第4个项目之后换行到下一行。

粘贴您的css代码或示例小提琴，以获得更多帮助。

如何在html和css中创建垂直图库

1 个答案: