Question

所以我想做一些非常简单的事情，我无法弄清楚。我现在正在建立一个论坛，我通常会遇到错误（后端）现在一切正常，可能是通过我使用的黑魔法; D，

现在，问题是：我想显示所有子类别，所以我使用下表：

<div id="content_big">
    <div class="content_top_oranje">
        <p class="koptekst">
            <?php echo 'Name';?>
        </p>
        <p style="float:left; margin-left:70%; margin-top:-30px; color:#fff; font-size:11px;font-family:Ubuntu;">
            <?php echo 'Description';?>
        </p>
    </div>
    <div class="content_mid">
        <?php $kop='algemeen' ;
              $query=$ db->conn->prepare("SELECT * FROM ht_forum_categorien WHERE kop = ?");
              $query->bind_param('s', $kop);
              $query->execute();
              $result = $query->get_result();
              while ($row = $result->fetch_assoc()) { ?>
        <table style="width:100%;" border="1" cellspacing="0">
            <tr>
                <td>
                    <?php echo $row[ 'name']; ?>
                </td>
                <td style="margin-left:50px;">
                    <?php echo $row[ 'description]; ?>
                </td>
            </tr>
        </table>
        <?php
              }
        ?>
    </div>
</div>

但是当我使用它时，这是我得到的输出： Kinda weird table

所有行如何不能垂直对齐？以及如何解决？

感谢。（对不起截图是在荷兰语中，但我无法更改数据库中的值，因为它不是我的

Answer 1

您的代码中存在两个相当大的问题：

最重要的是，您遇到的问题是：您没有生成表格。您正在生成批次表格。如果您需要一个表格，请将您的<table>和</table>标记移到循环之外，并在while循环中仅生成<tr>及其内容。
你没有意识到你遇到的问题：你使用的HTML不忠实于你的标记是语义的承诺：该标题应该是标题元素（h1，h2，h3，你有什么），作为一个表，实际上这不应该是divs和p以及table，这应该是一个表格，标题行，标题为您的标题，以及然后是数据行。

因此，让我们将其重写为从PHP和HTML角度来看都有意义的东西：

<?php
  ...query your data. Do this first...
  $result = ...;
  if($result isn't empty) {
?>
<table>
  <?php
    echo "<thead><th>$kop</th><th>$description</th></thead>";
  ?>
  <tbody>
  <?php
    while ($row = $result->fetch_assoc()) {
      $name = $row['name'];
      $desc = $row['description'];
      echo "<tr><td>$name</td><td>$desc</td></tr>\n";
    }
  ?>
  </tbody>
</table>
<?php } ?>

所以不要在表内进行查询，先进行查询，然后如果有结果显示，则决定是否编写单表，在tbody中生成动态内容作为表行。并使用CSS按照您需要的方式设置thead单元格的样式。

就此而言，不要使用所有内联style="..."位。它们都是相同的，所以你只是不必要地重复静态CSS。使用class="rowclass"或您认为合适的名称，然后在样式表或<style>块中，定义

.rowclass {
  background-color: ...;
  color: ...;
  ...
}

Answer 2

试试这个

 <div id="content_big">
    <div class="content_top_oranje">
        <p class="koptekst">
            <?php echo 'Name';?>
        </p>
        <p style="float:left; margin-left:70%; margin-top:-30px; color:#fff; font-size:11px;font-family:Ubuntu;">
            <?php echo 'Description';?>
        </p>
    </div>
    <div class="content_mid">
        <?php $kop='algemeen' ;
              $query=$ db->conn->prepare("SELECT * FROM ht_forum_categorien WHERE kop = ?");
              $query->bind_param('s', $kop);
              $query->execute();
              $result = $query->get_result();
               ?>
        <table style="width:100%;" border="1" cellspacing="0">
        <?php while ($row = $result->fetch_assoc()) { ?>
            <tr>
                <td>
                    <?php echo $row[ 'name']; ?>
                </td>
                <td style="margin-left:50px;">
                    <?php echo $row[ 'description']; ?>
                </td>
            </tr>
               <?php
              }
        ?>
        </table>

    </div>
</div>

表格不垂直对齐

2 个答案: