php 如何将此 SQLDatabase 数据回显到样式化表中？

Question

我正在尝试将 SQL 数据库中的数据回显到看起来不错的表中。我已经可以将数据正确地回显到 5 个单独的基本表中，但是当我无法弄清楚如何在不完全混乱的情况下对其进行样式设置时。这是我已经有了的代码：

    // OUTPUTS RESULTS //

$resultfirst = mysql_query("SELECT * FROM Students WHERE FirstPeriod='$_POST[firstperiod]'");
$resultsecond = mysql_query("SELECT * FROM Students WHERE SecondPeriod='$_POST[secondperiod]'");
$resultthird = mysql_query("SELECT * FROM Students WHERE ThirdPeriod='$_POST[thirdperiod]'");
$resultfourth = mysql_query("SELECT * FROM Students WHERE FourthPeriod='$_POST[fourthperiod]'");
$resultfifth = mysql_query("SELECT * FROM Students WHERE FifthPeriod='$_POST[fifthperiod]'");


// 1st PERIOD

echo "<table border='1' bgcolor='#3b5998' style='float:left; margin:20'>
<tr>
<th>First Period</th>
</tr>";

while($row = mysql_fetch_array($resultfirst))
  {
  echo "<tr>";
  echo "<td>" . $row['StudentName'] . "</td>";
  echo "</tr>";
  }
echo "</table>";



// 2nd PERIOD

echo "<table border='1' bgcolor='#3b5998' style='float:left; margin:20'>
<tr>
<th>Second Period</th>
</tr>";

while($row = mysql_fetch_array($resultsecond))
  {
  echo "<tr>";
  echo "<td>" . $row['StudentName'] . "</td>";
  echo "</tr>";
  }
echo "</table>";



// 3rd PERIOD

echo "<table border='1' bgcolor='#3b5998' style='float:left; margin:20'>
<tr>
<th>Third Period</th>
</tr>";

while($row = mysql_fetch_array($resultthird))
  {
  echo "<tr>";
  echo "<td>" . $row['StudentName'] . "</td>";
  echo "</tr>";
  }
echo "</table>";



// 4th PERIOD

echo "<table border='1' bgcolor='#3b5998' style='float:left; margin:20'>
<tr>
<th>Fourth Period</th>
</tr>";

while($row = mysql_fetch_array($resultfourth))
  {
  echo "<tr>";
  echo "<td>" . $row['StudentName'] . "</td>";
  echo "</tr>";
  }
echo "</table>";




// 5th PERIOD

echo "<table border='1' bgcolor='#3b5998' style='float:left; margin:20'>
<tr>
<th>Fifth Period</th>
</tr>";

while($row = mysql_fetch_array($resultfifth))
  {
  echo "<tr>";
  echo "<td>" . $row['StudentName'] . "</td>";
  echo "</tr>";
  }
echo "</table>";

如果上面的代码不清楚 - 我的目标是比较数据库中存储的第一时段教师，并输出共享同一时段/教师的学生姓名。 这段代码工作正常。但桌子看起来很平淡。我想将数据回显到这样的表中。

<table width="368" border="0" cellspacing="0" cellpadding="2" align="center" height="100">
    <tr valign="middle"> 
      <td bgcolor="#000066" width="120" height="20"> 
        <div align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2">Web 
          Services</font></b></font> </div>
      </td>
      <td width="4" height="20"></td>
      <td bgcolor="#990000" width="120" height="20"> 
        <div align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2">Web 
          Products</font></b></font></div>
      </td>
      <td width="4" height="20"></td>
      <td bgcolor="#C89800" width="120" height="20"> 
        <div align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2">Web 
          Resources</font></b></font> </div>
      </td>
    </tr>
    <tr valign="top"> 
      <td bgcolor="#000066" width="120"> 
        <table width="100%" border="0" cellspacing="0" cellpadding="3" height="80">
          <tr bgcolor="#FFFFFF" valign="top"> 
            <td> 
              <p><font face="Verdana, Arial, Helvetica, sans-serif" size="1">Professional 
                and cost effective web design, development and promotion services 
                </font></p>
            </td>
          </tr>
        </table>
      </td>
      <td width="4"></td>
      <td bgcolor="#990000" width="120"> 
        <table width="100%" border="0" cellspacing="0" cellpadding="3" height="80">
          <tr bgcolor="#FFFFFF" valign="top"> 
            <td> 
              <p><font face="Verdana, Arial, Helvetica, sans-serif" size="1">Interactive 
                Web Products - Flash Survey, poll, Guest book, Instant Quote

                </font></p>
            </td>
          </tr>
        </table>
      </td>
      <td width="4"></td>
      <td bgcolor="#C89800" width="120"> 
        <table width="100%" border="0" cellspacing="0" cellpadding="3" height="80">
          <tr bgcolor="#FFFFFF" valign="top"> 
            <td> 
              <p><font face="Verdana, Arial, Helvetica, sans-serif" size="1">Free 
                web resources - articles, tutorials, tips and tricks. 
               </font></p>
            </td>
          </tr>
        </table>
      </td>
    </tr>
  </table>

如果有人可以提供任何类型的建议 - 我将不胜感激。

Answer 1

我看到一些可以改进的地方：

• 正如其他人所说，不要使用表格来管理布局。然而，表格对于显示表格数据来说是完全可以接受的。
• 您确实想使用 CSS 来设计您的页面，它更容易控制您的样式并使标记更易于阅读。请参阅 CSS 表 上的这篇 w3schools 文章
• 您可以将多个查询合并为一个以获得更好的性能（不过，这似乎超出了您的问题范围）

以下是您的表的示例标记和 CSS： http://jsfiddle.net/vxzJV/