html - 在 PHP/HTML 中对齐信息

Question

我有这个代码，它当前显示如下信息：

 <?php
    mysql_connect("localhost","example","password") or die("Could not connect to localhost");
mysql_select_db("exampledb") or die( "Could not connect to database");
$result = mysql_query("SELECT * FROM tablexample");

echo "<b>" . "Name"  . "</b>" . "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" . "<b>" . "Number" . "</b>";
echo "<br/>";
echo "<br/>";
while ($row = mysql_fetch_array($result))
  {
echo  ucwords($row['name']) . "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" . ucwords($row['number']) . "<br>"; 
echo "<hr width='20%'>";
  }
?>


Name              Number

B              (888) 888-3545
C         (098) 545-4354
Cl               (888) 888-3545
Da              (888) 888-3545
H               (888) 888-3545
H               (888) 888-3545
Khzdf              (888) 888-3545

但我希望它们像这样对齐（它应该覆盖每个名称有多少个字母并具有相同的空格：

Name              Number

B              (888) 888-3545
C              (098) 545-4354
Cl             (888) 888-3545
Da             (888) 888-3545
H              (888) 888-3545
H              (888) 888-3545
Khzdf          (888) 888-3545

-- 这会在 CSS 或 PHP 中完成吗？

Answer 1

你考虑过用桌子吗？表格很棒....用于显示结构化数据

<table>
    <thead>
        <tr>
            <th>Column1</th>
            <th>column</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Column1 data</td><td>column 2 data</td>
        </tr>
    </tbody>
</table>

Answer 2

这会在 CSS 或 PHP 中完成吗？

两者都不！HTML<table>是您正在寻找的内容。它们也具有足够的语义。

Answer 3

解决问题的最快方法是这样。

在您的代码中，您可以更改：

echo  ucwords($row['name']) . "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" . ucwords($row['number']) . "<br>";

对此：

echo  "<span style='display:inline-block; width:200px; text-align:left;'>" . ucwords($row['name']) . "</span><span style='display:inline-block; text-align:left;'>" . ucwords($row['number']) . "</span><br>";

注意：200px根据需要更改。