Php 在div标记内联中获取元素

下面的php脚本用于从数据库检索数据并显示在网页中！我已经使用了div标签，但不知道如何内联显示它们。我该怎么做

<?php
                require("includes/db.php");

                $sql="SELECT * FROM `order` ";
                $result=mysqli_query($db,$sql);


    echo"<div style='width:50px'>";
    echo "Order No.";
    echo"</div>";
    echo"<div style='width:50px'>";
    echo "NIC no";
    echo"</div>";
    echo"<div style='width:50px'>";
    echo "Delivery/Pickup";
    echo"</div>";
    echo"<div style='width:50px'>";
    echo "Address";
    echo"</div>";
    echo"<div style='width:50px'>";
    echo "Expect time";
    echo"</div>";
    echo"<div style='width:50px'>";
    echo "Telephone";
    echo"</div>";
    echo"<div style='width:50px'>";
    echo "Email";
    echo"</div>";
    echo"<div style='width:100px'>";
    echo "Prescription-1";
    echo"</div>";
    echo"<div style='width:100px'>";
    echo "Prescription-2";
    echo"</div>";
    echo"<div style='width:100px'>";
    echo "Prescriptions-3";
    echo"</div>";



    while($row=mysqli_fetch_array($result))
    {

       echo"<div style='width:50px'>";
        echo $row["OrderNo."];
         echo"</div>";
          echo"<div style='width:50px'>";
        echo $row["NIC"];
         echo"</div>";
          echo"<div style='width:50px'>";
        echo $row["DP"];
         echo"</div>";
          echo"<div style='width:50px'>";
        echo $row["Address"];
         echo"</div>";
          echo"<div style='width:50px'>";
        echo $row["DPTime"];
         echo"</div>";
          echo"<div style='width:50px'>";
        echo $row["Telephone"];
         echo"</div>";
          echo"<div style='width:50px'>";
        echo $row["Email"];
         echo"</div>";
         echo"<div style='width:100px'>";
       echo '<a href='.( $row['Image1'] ).' >';
       echo "<img src='" .$row['Image1']. "' height='200' width='200'/>";
        echo "</a>";
         echo"</div>";


       echo"<div style='width:100px'>";
       echo '<a href='.( $row['Image1'] ).' >';
       echo "<img src='" .$row['Image1']. "' height='200' width='200'/>";
        echo "</a>";
         echo"</div>";

       echo"<div style='width:100px'>";
       echo '<a href='.( $row['Image1'] ).' >';
       echo "<img src='" .$row['Image1']. "' height='200' width='200'/>";
        echo "</a>";
         echo"</div>";
    }
       ?> 

---

对结果使用
标记，而不是div。每个循环将是
，值将是
，您可以通过使用具有指定CSS样式的合适容器元素来实现所需的布局，如下例所示。但是，由于图像的显式大小是指定给父div的宽度的两倍，因此布局会中断-也许使用CSS控制图像的大小会更容易

<style type='text/css'>
    #headers,
    .row{
        width:auto;
        float:left;
        clear:both;
        display:block;
        margin:0;
        padding:0;
        box-sizing:border-box;
        font-size:0.7rem;
    }
    #headers > div{
        background:black;
        color:white;
    }
    #headers > div,
    .row > div {
        display:inline-block;
        border:1px dotted black;
        clear:none;
        float:left;
        margin:0;
        box-sizing:border-box;
        width:50px;
        height:1.5rem;
    }
    .w100{width:100px;}
</style>


<?php
    require("includes/db.php");

    $sql="SELECT * FROM `order` ";
    $result=mysqli_query($db,$sql);


    echo"
    <div id='headers'>
        <div>Order No.</div>
        <div>NIC no</div>
        <div>Delivery/Pickup</div>
        <div>Address</div>
        <div>Expect time</div>
        <div>Telephone</div>
        <div>Email</div>
        <div class='w100'>Prescription-1</div>
        <div class='w100'>Prescription-2</div>
        <div class='w100'>Prescriptions-3</div>
    </div>";



    while( $row=mysqli_fetch_array( $result ) ){

        echo"
        <div class='row'>
            <div>{$row['OrderNo.']}</div>
            <div>{$row['NIC']}</div>
            <div>{$row['DP']}</div>
            <div>{$row['Address']}</div>
            <div>{$row['DPTime']}</div>'
            <div>{$row['Telephone']}</div>
            <div>{$row['Email']}</div>
            <div class='w100'>
                <a href='{$row['Image1']}' >
                    <img src='{$row['Image1']}' height='200' width='200'/>
                </a>
            </div>
            <div class='w100'>
                <a href='{$row['Image1']}' >
                    <img src='{$row['Image1']}' height='200' width='200'/>
                </a>
            </div>
            <div class='w100'>
                <a href='{$row['Image1']}'>
                    <img src='{$row['Image1']}' height='200' width='200'/>
                </a>
            </div>
        </div>";
    }
?>


#标题，
.行{
宽度：自动；
浮动：左；
明确：两者皆有；
显示：块；
保证金：0；
填充：0；
框大小：边框框；
字体大小：0.7rem；
}
#标题>div{
背景：黑色；
颜色：白色；
}
#标题>div，
.行>分区{
显示：内联块；
边框：1px点黑色；
明确：无；
浮动：左；
保证金：0；
框大小：边框框；
宽度：50px；
高度：1.5雷姆；
}
.w100{宽度：100px；}
你所说的“如何内联显示它们”到底是什么意思？使用
css
设置适当的条件-float、clear etcDid和google？这是一件非常常见的事情，请尝试搜索名为
display
的CSS属性，它们在显示时一个接一个出现，我希望它们出现在同一行中！（像一个表格行）这里有些奇怪的布局-您为div或100px指定了一个宽度，但添加了一个定义为with/height为200px的图像