Question

我是PHP的新手，正在研究一个非常简单的SELECT查询，该查询从MySQL数据库中提取信息。我有一条echo语句，打印出我与数据库的连接成功，这是网页上的第一行。显示“成功连接”后，SELECT语句将查询信息拉入表中。
目前，所有内容都可以正确提取和显示，但是我的echo连接语句和实际表结果之间有很大的差距。我试图直接将表格与“ TOP”对齐，但这仍然产生了很大的差距。

<!DOCTYPE html>
<html>

<style>
#trip th {
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: left;
    background-color: #4CAF50;
    color: white;
}

#trip {
    border-collapse: collapse;
    width: 75%;
}

#trip td, #trip th {
    border: 1px solid #ddd;
    padding: 8px;
}

#trip tr:nth-child(even){
    background-color: #f2f2f2;
}

#trip tr: hover {
    background-color: #ddd;
}
</style>

<body>
<?php
    require "Login.php";
?>

<?php

//Create Connection
$conn = mysqli_connect($serverName, $userName, $password, $dbName);

//Check connection
if ($conn === false) {
    die("ERROR: Could not Connect. " . mysqli_connect_error());
}

echo "Connected successfully";

//SQL SELECT query execution
$sql = "SELECT * FROM Trip";
if($result = mysqli_query($conn, $sql)){
    if(mysqli_num_rows($result) > 0){
        echo "<table id='trip' align='top'>";
            echo "<tr>";
                echo "<th>TID </th>";
                echo "<th>NAME </th>";
                echo "<th>DATE </th>";
                echo "<th>COST </th><br>";
            echo "</tr>";
        while($row = mysqli_fetch_array($result)){
            echo "<tr>";
                echo "<td>" . $row['TID'] . " </td>";
                echo "<td>" . $row['NAME'] . " </td>";
                echo "<td>" . $row['DATE'] . " </td>";
                echo "<td>" . $row['COST'] . " </td>";
            echo "</tr>";
        }
        echo "</table>";
        //Free result set
        mysqli_free_result($result);
    }
    else {
        echo "No records matching your query were found";
    }
}
else {
    echo "ERROR: Could not execute $sql. " . mysqli_error($conn);
}

//Close connection
mysqli_close($conn);

?>
</body>
</html>

我希望表格显示在我的“已成功连接”消息的正下方，但是似乎有些东西使表格在页面的下方。

编辑修复了当我尝试粘贴到Stackoverflow中时添加的“ \”。不知道为什么要添加。它不在我的实际PHP文件中。

Answer 1

问题是此行结尾处的<br>：

echo "<td>" . $row['COST'] . " </td><br>";

由于<br>元素中不允许<tr>，因此浏览器会在表之前呈现它们。因此，表格前的空白行数与表格行数相同。

摆脱它，没有任何目的。

#trip th {
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: left;
  background-color: #4CAF50;
  color: white;
}

#trip {
  border-collapse: collapse;
  width: 75%;
}

#trip td,
#trip th {
  border: 1px solid #ddd;
  padding: 8px;
}

#trip tr:nth-child(even) {
  background-color: #f2f2f2;
}

#trip tr: hover {
  background-color: #ddd;
}

<div>Connected successfully</div>
<table id='trip' align='top'>
  <tr>
    <th>TID </th>
    <th>NAME </th>
    <th>DATE </th>
    <th>COST </th>
  </tr>
  <tr>
    <td>TID</td>
    <td>NAME</td>
    <td>DATE</td>
    <td>COST</td>
  </tr>
  <tr>
    <td>TID</td>
    <td>NAME</td>
    <td>DATE</td>
    <td>COST</td>
  </tr>
  <tr>
    <td>TID</td>
    <td>NAME</td>
    <td>DATE</td>
    <td>COST</td>
  </tr>
</table>

PHP控制表格在网页上的放置位置

1 个答案: