Question

嘿伙计这对你来说可能是一个愚蠢的问题，但我有一个包含足球运动员名字的数据库（请看屏幕截图）我需要做的是并排显示5个名字，然后在下面5个，如果这有意义的话。有一个简单的方法吗？

建立连接后我目前拥有的代码

        $sql = "SELECT ID, NAME FROM players";
        $result = $conn->query($sql);


        if ($result->num_rows > 0) {
            // output data of each row
            while($row = $result->fetch_assoc()) {
                // Outputting HTML and the data from the DB. Change to $row['the name of the field you want']
                echo "<div class='caption'><h3><img src='http://placehold.it/180x180' alt=''>" . $row['NAME'] . "</h3><p>";
            }
        } else {
            echo "No players to show";
        }
        $conn->close();
    ?>

它是CSS我应该专注于使我看起来像我想要的方式？抱歉，我是一个新人，不能让我的头围绕它哈哈

Answer 1

试试这个：我添加了一个名为i的计数器，它会在列出5个名称后更改div。然后我将div设置为50％宽度并向左浮动，允许2个div并排。

<style>
.caption
{
   width:50%;
float:left;
}

<?php
 $sql = "SELECT ID, NAME FROM players";
        $result = $conn->query($sql);
        if ($result->num_rows > 0) {
            // output data of each row
echo "<div class='caption'>";
            while($row = $result->fetch_assoc()) {
           $i = 0;
             if($i>=4)
{
$i = 0;
echo "</div><div class='caption'>";
                // Outputting HTML and the data from the DB. Change to $row['the name of the field you want']
                <h3><img src='http://placehold.it/180x180' alt=''><h3>" . $row['NAME'] . "<h3>";
            }
        } else {
            echo "No players to show";
        }
        $conn->close();
    ?>
</div>

Answer 2

是的，你正在以正确的方式行事。你只需要做一些CSS。您可以在此处获取一些帮助： - https://designshack.net/articles/css/5-simple-and-practical-css-list-styles-you-can-copy-and-paste/

将PHP表添加到mySQL文件中

2 个答案: