【问题标题】:how to get items from database into a well formatted table如何从数据库中获取项目到格式良好的表中
【发布时间】:2016-04-14 01:20:33
【问题描述】:

我有一个从数据库中获取项目的网站。目前的方式是所有项目都在一个列中。我希望这些项目出现在 3 列中,然后在它们下面再出现 3 列,依此类推。有人知道怎么做吗?

这是我的代码

<?php
    // Default query for this page:
    $q = "SELECT * FROM item";
    // Create the table head:
    echo '
        <div class="container">
            <div class="table-responsive">
                <table border="5" class="col-lg-4" cellspacing="3" cellpadding="3" align="center">
                    <tr>
                        <td align="left" width="15%"><b>Photo</b></td>
                        <td align="left" width="5%"><b>Condition</b></td>
                    </tr>
            </div>
        </div>
        </div>
        </div>
    ';

// Display all the items, linked to URLs:
$r = mysqli_query ($dbc, $q);
while ($row = mysqli_fetch_array ($r, MYSQLI_ASSOC)) {
    $directory = '/uploads';
    $file= $row['image_name'];
    // Display each record:
    echo "
        <tr>
            <td align=\"center\"><image src=$directory/$file title='$row[image_name]'  width='213' height='200'></td>
            <td align=\"center\">{$row['state']}</td>
        </tr>
    ";
}
echo '</tbody>';
echo '</table>';
mysqli_close($dbc);

【问题讨论】:

  • 这与 PHP 没有任何关系,都是关于 HTML 和 CSS 的。例如,如果您将 table 替换为一系列 div 元素,那么您可以使用 CSS 为这些 divs 创建各种流畅的布局。
  • 我将如何格式化它以便 div 放在我想要的位置?
  • 您要制作一张桌子吗?另外,您获得的数据是什么样的?这个问题很模糊。

标签: php html mysql css


【解决方案1】:

如果我没记错的话,你需要每行 3 个项目,并且你正在使用 twitter bootstrap css 框架。

您的问题主要来自您使用的 HTML 结构。

试试这样的:

<div class="container">
    <div class="row">
        <div class="col-lg-4">item 1</div>
        <div class="col-lg-4">item 2</div>
        <div class="col-lg-4">item 3</div>
        <div class="col-lg-4">item 4</div>
        <div class="col-lg-4">item 5</div>
        <div class="col-lg-4">item 6</div>
    </div>
</div>

【讨论】:

    【解决方案2】:

    您的 HTML 看起来很糟糕,这可能是导致显示问题的原因。

    尝试从标记的行上方删除这 4 个关闭 div

    // 显示所有项目,链接到 URL:

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2017-02-09
      • 1970-01-01
      • 1970-01-01
      • 2014-05-22
      • 2021-12-22
      • 2020-05-20
      • 2021-05-08
      相关资源
      最近更新 更多