html - HTML 表格格式问题

Question

我正在制作一个 html 页面，其中我为某些元素使用表格。如下图所示:

该表的代码如下:

<table border="2">
 <tbody><tr>
  <td width="50">
    <b>
        <span style="color:red">
            Id
        </span>
    </b>
  </td>
  <td width="150">
    <b>
        <span style="color:red">
            Product Name
        </span>
    </b>
  </td>
  <td width="150">
    <b>
        <span style="color:red">
            Product Price
        </span>
    </b>
  </td>
  <td width="50"></td>
 </tr>

      <tr>
   <td>1</td>
   <td>Lamps</td>
   <td><i>$3.5</i></td>
   <td> <a href="/app_name/editpage.htm?id=1&amp;prodname=Lamps&amp;prodprice=3.5">Edit</a></td>
   <td><a href="/app_name/deleteprod.htm?id=1&amp;prodname=Lamps&amp;prodprice=3.5">Delete</a></td>
  </tr>

      <tr>
   <td>2</td>
   <td>Table</td>
   <td><i>$75.29</i></td>
   <td> <a href="/app_name/editpage.htm?id=2&amp;prodname=Table&amp;prodprice=75.29">Edit</a></td>
   <td><a href="/app_name/deleteprod.htm?id=2&amp;prodname=Table&amp;prodprice=75.29">Delete</a></td>
  </tr>

      <tr>
   <td>3</td>
   <td>Chair</td>
   <td><i>$22.81</i></td>
   <td> <a href="/app_name/editpage.htm?id=3&amp;prodname=Chair&amp;prodprice=22.81">Edit</a></td>
   <td><a href="/app_name/deleteprod.htm?id=3&amp;prodname=Chair&amp;prodprice=22.81">Delete</a></td>
  </tr>

     </tbody></table>

现在我的问题是，为什么标题行没有完成，怎么办？我是 html 和 css 的新手，我正在学习它。请需要指导。谢谢。

Answer 1

底行中有更多列。 有很多解决方案:

解决您的问题的一种(不太好)方法是在顶行添加更多单元格。

<td width="50">&nbsp;</td>
<td width="50">&nbsp;</td>

( http://jsfiddle.net/tCrRG/ )

或者，尝试查看 colspan 和 rowspan:

<td width="150" colspan="3">
    <b>
        <span style="color:red">
            Product Price
        </span>
    </b>
  </td>

( http://jsfiddle.net/tCrRG/1/ )

或者，使用 colspan 在顶行中仅添加 一个 单元格:

<td colspan="2">
    &nbsp;
</td> 

(http://jsfiddle.net/tCrRG/2/)