如何在一行中显示从数据库值生成的有序列表?

时间:2011-11-25 17:58:43

标签: html css

在下面的php代码中,我获取从数据库中购买的项目列表。因为它以逗号分隔的值存储,所以它会爆炸并在while循环中获取。作为输出我得到订购的物品清单.. 但我想要有序列表水平显示。

现在输出如下:

买的物品

  1. 咖啡壶
  2. 洗衣机
  3. 例如,输出应为:

    购买的物品:1)咖啡壶2)洗衣机

    请帮助我如何通过列表或任何方式来实现这种输出。

    <?
        echo "<strong>Items Bought:</strong>";
            echo "<ol>";
                        $q=mysql_query("select * from lead where id='$ID'");
                        $rs=mysql_fetch_object($q);
                        $prod_interest = $rs->interested_in;
                        $prod_name = explode(",", $prod_interest);
    
                        $pname='';
                        for($i = 0; $i < count($prod_name); $i++){
    
                        $prd_name= $prod_name[$i];
                        //taking the product name for the id
                        $productname=mysql_query("select * from product where id='$prd_name'");
    
                        while ($prow=mysql_fetch_object($productname))
                        {
                    ?>
                    <li value="<? echo $pname=$prow->id;?>"><? echo $pname=$prow->name;?></li>
                    <?
                            }
                        }
                        echo "</ol>";
                    ?>
    

3 个答案:

答案 0 :(得分:1)

我认为这个问题更多的是HTML问题,你的LI可能已经浮出水面,这就是为什么你得到一个左边的权利列表......

编辑:

OH,然后您想将此样式添加到您的页面:

<style>
ol li {
    float: left;
}
</style>

编辑2:

<style>
ol li {
    float: left;
    padding-left: 10px;
    display: block;
    list-style-type: decimal;
}
</style>

答案 1 :(得分:1)

这是一个HTML / CSS而非PHP问题。使用<ol><li>,您会得到一个垂直排序的列表。例如:

  1. 第1项
  2. 第2项
  3. 当你想要它们水平时,你可以

    使用CSS将块<li>元素转换为内联元素:

    echo '<ol>';
    while ($prow=mysql_fetch_object($productname)) {
      echo '<li style="display: inline">';
      echo $prow->id . ' ' . $prow->name;
      echo '</li>';
    }
    echo '</ol>';
    

    根本不使用列表:

    while ($prow=mysql_fetch_object($productname)) {
      echo $prow->id . ' ' . $prow->name . ' ';
    }
    

答案 2 :(得分:0)

这听起来像是CSS问题而不是PHP问题。默认情况下,列表应垂直显示,除非您有reset.css或类似的“重置”列表行为。

如果要确保打印垂直有序列表,请执行以下操作:

<ol class="vertical_ol">
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
</ol>

在CSS中输入:

.vertical_ol li {
    display:block;
    float:none;
}