数据库结果以与分配的内联和块相反的顺序显示

Posted

技术标签:

【中文标题】数据库结果以与分配的内联和块相反的顺序显示【英文标题】:Database results displaying in reverse order of inline and block from what is assigned 【发布时间】:2015-10-07 20:43:47 【问题描述】:

我正在尝试通过 while 循环从我的数据库中输出信息。我希望结果像这样显示...

名字姓氏 - 名字姓氏 - 名字姓氏

玩家1 ---------------玩家1-----------玩家1

player2 ----------------player2-------------------------player2

player3 ------------------player3----------------------player3

但是我的结果是这样显示的...

名字姓氏

玩家1 - 玩家2 - 玩家3

名字姓氏

玩家1 - 玩家2 - 玩家3

firstname、lastname、player1、player2 和 player 3 都是我的 db 表中的列。每次有新用户时,他们都会被插入到新玩家所在的新行中。

代码:

<h1>Draft Order</h1>
<?php
$con = mysqli_connect("localhost", "", "", "");
$stmt = mysqli_query($con,"SELECT * FROM user_players");

while($row = mysqli_fetch_array($stmt)) 
    $player1 = $row['player1'];
    $player2 = $row['player2'];
    $player3 = $row['player3'];
?>
        <div class="inline">
        <?php echo $row['firstname'] . " " . $row['lastname']; ?>
        </div>
        <div class="draftBorder">
<?php
echo $player1;
echo $player2;
echo $player3;
?>
        </div>
<?php

?>

CSS

.inline 
    display: inline;
    padding: 10px;

/*------Draft Page---*/
.draftBorder 
    border: 1px solid black;
    display: block;

我在一个名为“内联”的类中有名字和姓氏字段,以使这些字段内联,但它们显示为块。

我有一个名为“draftBorder”的类中的玩家并将其设置为阻止,但它显示为内联。

为什么这些显示是相反的,我怎样才能改变它以获得我想要的结果。

更新:现在显示...

名字 - 姓氏

玩家1

玩家2

玩家3

名字姓氏

玩家1

玩家2

玩家3

名字姓氏

玩家1

玩家2

玩家3

更新:来自float: left; 建议

名字姓氏-----player1

player3-----------------player2

名字姓氏-----player1

player3-----------------player2

名字姓氏-----player1

player3-----------------player2

【问题讨论】:

我不知道你在期待什么,但看起来你只是将文本插入到 2 个 div 中。在父 div 上定义 display:block; 不会使您的 $player 变量显示块...它只是 div 中的文本 如何让 $player 变量显示块,并且 firstname 和 lastname 变量显示内联? 尝试将它们包装在 &lt;div&gt; 中,如下所示:&lt;div&gt;&lt;?php echo $player1;&lt;?php&gt;&lt;/div&gt; 也许。不过我不懂php 好的,这适用于$players。我试图将 firstname 和 lastname echo 行包装在 $players 之类的 div 中,但什么也没做。我将更新我的问题以显示它的显示方式。 好的,尝试删除您刚刚应用于.inlinefloat。然后将.inline.draftBorder 包装在一个div 中(循环中每组这些div 的容器),并给该div 一个display:inline-block;float:left;。有意义吗? 【参考方案1】:

我不确定我是否完全理解这里的要求,但请给这个代码演示一下,让我知道结果。

    <?php
    $con = mysqli_connect("localhost", "", "", "");
    $stmt = mysqli_query($con,"SELECT CONCAT_WS(" ", first_name, last_name) AS fullname, player1, player2, player3 FROM user_players");

    while($row = mysqli_fetch_array($stmt)) 

    echo '<h1>Draft Order</h1>';

    echo '<div style="display: block; width: 100%;">';
    for($i=1; $i<4; ++$i)


       echo '<div class="draftBorder">';
       echo $row['fullname'];
       echo '</div>';

       echo '<div class="draftBorder">';
       echo $row['fullname'];
       echo '</div>';

       echo '<div class="draftBorder">';
       echo $row['fullname'];
       echo '</div>';


    

 echo '</div>';



    echo '<div style="display: block; width: 100%;">';
    for($i=1; $i<4; ++$i)
    $player = $row['player'.$i]

       echo '<div class="draftBorder">';
       echo $player;
       echo '</div>';

       echo '<div class="draftBorder">';
       echo $player;
       echo '</div>';

       echo '<div class="draftBorder">';
       echo $player;
       echo '</div>';


    

 echo '</div>';

 
?>

还将您的 draftBorder 类更改为此

.draftBorder 
    border: 1px solid black;
    display: inline-block;
    width: 33.33%;

【讨论】:

以上是关于数据库结果以与分配的内联和块相反的顺序显示的主要内容,如果未能解决你的问题,请参考以下文章

前端的一些概念剖析---文档流内联元素和块级元素

CSS水平菜单:显示:内联和块?让链接覆盖整个LI?

行内元素和块级元素水平及垂直居中

常见的内联元素和块级元素

内联元素和块元素的区别以及转换

关于CSS的内联和块元素