如何在顺序 div 中显示 MySQL 查询结果

Question

我被困在那一刻，我想从mysql数据库以顺序的方式显示内容。我得到的查询成功，但我得到的结果在div在一个列表的方式。有谁能告诉我它是如何按顺序显示的吗?代码是

$sql="select * from admn_pckge";
$result=mysql_query($sql);
<?php
     if(mysql_num_rows($result)>0)
     {
         while($row=mysql_fetch_array($result))
         {
             ?>
             <div class="pricing-container">
                 <div class="header">
                    Premium
                 </div>
             <div class="price">
                 <span>
                     <sup class="currency"></sup><span class="figure"><?php echo $row['admn_pckge_price']; ?></span> <sup class="cent">
                  Rs</sup> 
                     <sup class="frequency">Event</sup>
              </span>
              <div class='details'>based on 1 yr</div>
             </div>
             <div class="itemsWrapper">
                 <ul class="items">
                     <div class="item">
                           <?php echo $row['admn_pckge_itm1']; ?>     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php echo $row['admn_pckge_itm1_qty']; ?>
                     </div><hr/>
                     <div class="item">
                           <?php echo $row['admn_pckge_itm2']; ?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php echo $row['admn_pckge_itm2_qty']; ?>
                     </div><hr/>
                     <div class="item">
                        <?php echo $row['admn_pckge_itm3']; ?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php echo $row['admn_pckge_itm3_qty']; ?>
                    </div><hr/>
                     <div class="item">
                            <?php echo $row['admn_pckge_itm4']; ?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php echo $row['admn_pckge_itm4_qty']; ?>
                     </div><hr/>
                     <div class="item">
                        <?php echo $row['admn_pckge_itm5']; ?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php echo $row['admn_pckge_itm5_qty']; ?>
                     </div><hr/>
                     <div class="item">
                        <?php echo $row['admn_pckge_itm6']; ?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php echo $row['admn_pckge_itm6_qty']; ?>
                    </div><hr/>
                     <div class="item">
                        <?php echo $row['admn_pckge_itm7']; ?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php echo $row['admn_pckge_itm7_qty']; ?>
                     </div><hr/>
                     </ul>
                 </div>
             </div>
             <?php
              }
             }
            ?>
            <style>
           .pricing-container {
               width: 300px;
               text-align: center;
               font-family: 'Open Sans Condensed', sans-serif;
            }
           .pricing-container .header {
               background: #2F2F2F;
               color: white;
               padding: 25px;
               font-size: 2.5em;
               font-weight: 300;
               border-radius: 5px 5px 0 0;
           }
       .pricing-container .price {
        background: #66D2AC;
       background: linear-gradient(10deg, #93da9f 30%, #66d2ac 80%);
       color: white;
       padding: 10px;
       box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
       text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
       font-size: 1.3em;
       }
      .pricing-container .price .figure {
      font-weight: 800;
     font-size: 1.2em;
     margin: 0 2px;
     }
     .pricing-container .price .cent {
     text-decoration: underline;
      }
    .pricing-container .price .frequency {
     color: #2F757F;
     text-shadow: none;
      }
      .pricing-container .price:hover .details {
     height: 20px;
     }
    .pricing-container .price .details {
     color: #2F757F;
     font-size: .6em;
      display: block;
       height: 0;
      overflow: hidden;
       transition: all 400ms ease;
      }
     .pricing-container .itemsWrapper {
    border: 2px solid #E6E6E6;
       border-top: none;
       border-radius: 0 0 2px 2px;
     background: white;
       box-shadow: inset 14px 0 white, inset 15px 0 #f2f2f2, inset -14px 0  white, inset -15px 0 #f2f2f2;
      }
     .pricing-container .itemsWrapper .items {
      list-style: none;
      padding: 15px;
       margin: 0;
       }
      .pricing-container .itemsWrapper .item {
     padding: 10px;
        text-transform: capitalize;
        font-size:20px;
       font-style:oblique;
         }
        </style>

Answer 1

尝试将您的CSS移动到其他代码之上…它真的应该在你的<head></head>标签里面。

那么你有两个选择…

1. 如果你想让所有div都在一个列表项中，这是代码示例

2. ,,,,,,,

   ---

   ,,,,,,,

   ---

   ,,,,,,,

   ---

3. 如果你想让每个div都是它自己的列表项，这是代码示例…

             <ul class="items">
               <li>
                 <div class="item">
                       <?php echo $row['admn_pckge_itm1']; ?>     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php echo $row['admn_pckge_itm1_qty']; ?>
                 </div><hr/>
               </li>
               <li>
                 <div class="item">
                       <?php echo $row['admn_pckge_itm2']; ?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php echo $row['admn_pckge_itm2_qty']; ?>
                 </div><hr/>
               </li>
               <li>
                 <div class="item">
                    <?php echo $row['admn_pckge_itm3']; ?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php echo $row['admn_pckge_itm3_qty']; ?>
                </div><hr/>
               </li>
                 </ul>
             </div>
         </div>
         <?php
          }
         }
        ?>
   

Answer 2

使用for循环而不是while循环，因为while循环将无限期地运行。