請幫我解決這個混亂的HTML表格

Question

我有一個似乎無法修復的簡單HTML表。

我試圖像這樣顯示數據：

                                  <-Previous Next->
                              51 to 100 of 10151 records

以下是html代碼。 我已經刪除了動態語言部分，該部分根據用戶所在的頁面添加了“上一頁”：

編輯：在所有響應后，我將代碼更改為以下代碼。 但對齊方式仍然相同。 > _ <

<table width="100%" border="0">
<tbody>
    <tr align="center">
       <td bgcolor="#ffffff" color="white" align="center" colspan="2">
       <!--some form elements go here!-->
       <!--I just replaced tags with some text for testing-->
       <font face="Arial" size="2"><strong>Previous</strong></font>
        Previous
       </td>
       <td bgcolor="#ffffff" color="white" align="center" colspan="2">
        Next
       </td>
    </tr>
    <tr align="center">
       <td align="center"><font face="arial" size="2"><b>51 to 100 of 10151</b> </font>
       </td>
    </tr>
</tbody>
</table>

預期的輸出在上面，但是我從代碼中得到的是：

                 Previous            Next Group   
         51 to 100 of 10151 Households  

我已經進行了一段時間的反復試驗，因此需要一些幫助！

Answer 1

您需要轉義屬性：

Value="<<Previous"

應該

Value="<<Previous"

Answer 2

為什么Previous和Next文本都需要表格單元格？ 為什么不將它們放在相同的<td>呢？

<table width="100%" border="0">
  <tbody>
    <tr align="center">
      <td bgcolor="#ffffff" color="white" align="center" colspan="2">
        Previous Next
      </td>
    </tr>
    <tr align="center">
      <td align="center"><font face="arial" size="2"><b>51 to 100 of 10151</b></font></td>
    </tr>
  </tbody>
</table>

我錯過了要求嗎？

Answer 3

在第二行的td中添加colspan="2" 。

Answer 4

使用html實體在屏幕上顯示<和>字符。 <是< 並且>是>

也會有幫助的是使用具有語法突出顯示功能的編輯器，您可以更輕松地發現這些錯誤

Answer 5

對於初學者，在第一行（<tr> ... </ tr>）之后，您將無法開始另一行。 另外，您需要對下一行的單元格進行列跨度，以使其占據其上一行的兩個單元格下的空間，而不僅僅是第一個：

<tr>
  <td align="center" colspan="2"><font....>....</td>
</tr>

此外，您還有其他HTML問題（如果希望它們出現在文本中，則需要轉出<和>之類的HTML實體），因此您可能希望通過了解HTML或通過其他方式對其進行驗證的編輯器來運行它。

Answer 6

您缺少一些標簽和引號，以及其他字符提到的轉義字符。

您可以嘗試在w3c使用htmlvalidator。

http://validator.w3.org/#validate-by-input

Answer 7

<table width="100%" border="0">
    <tr align="center">
       <td bgcolor="#ffffff" color="white" align="center">
            <!--some form elements go here!-->
            <font face="Arial" size="2"><strong>Previous</strong></font>
            <Input id='previuesButton' Type="image"  alt="Previous" src="/eiv/images/prev.gif" value="&lt;&lt;Previous" name=previuesButton ACCESSKEY="B">
       </td>
       <td bgcolor="#ffffff" color="white" align="center">
            <font face="Arial" size="2"><strong>Next Group</strong></font>
            <Input id='nextButton' alt="Next" Type="image" src="/eiv/images/next.gif" Value="Next&gt;&gt;" name=nextButton ACCESSKEY="B">
       </td>
    </tr>
    <tr>
       <td align="center" colspan="2"><font face="arial" size="2"><b>51 to 100 of 10151</b> </font></td>
    </tr>
</table>

您在底部的列中缺少起始行和結束行標簽以及colspan。 嘗試上面的方法，看看是否適合您。 另外，您還需要將小於和大於字符替換為它們的等價字符（如上所示）。

Answer 8

您是否遇到大於或小於符號的問題？

嘗試這個：

    <table width="100%" border="0">
<tbody>
    <tr align="center">
       <td bgcolor="#ffffff" color="white" align="center">
       <!--some form elements go here!-->
       <font face="Arial" size="2"><strong>&lt;-Previous</strong></font>
        <Input id='previuesButton' Type="image"  alt="Previous" src="/eiv/images/prev.gif"     
        Value="<<Previous" name=previuesButton ACCESSKEY="B">
       </td>
       <td bgcolor="#ffffff" color="white" align="center">
       <font face="Arial" size="2"><strong>Next Group-&gt;</strong></font>
       <Input id='nextButton' alt="Next" Type="image" src="/eiv/images/next.gif" Value="     
       Next>>     "name=nextButton ACCESSKEY="B">
       </td>
    </tr>
       <td align="center"><font face="arial" size="2"><b>51 to 100 of 10151</b> </font>
       </td>
</tbody>

這種幫助？

Answer 9

您的代碼，包括：

1. 添加了第二行缺少的標簽。
2. 箭頭轉換為html實體。
3. 缺少的引號已添加。
4. 您的拼寫已更正。

下次嘗試通過w3c驗證程序運行html。 希望能幫助到你。

<table width="100%" border="0">
<tbody>
    <tr align="center">
       <td bgcolor="#ffffff" color="white" align="center">
       <font face="Arial" size="2"><strong>Previous</strong></font>
        <Input id='previousButton' Type="image"  alt="Previous" src="/eiv/images/prev.gif"     
        Value="&lt;&lt;Previous" name="previousButton" ACCESSKEY="B">
       </td>
       <td bgcolor="#ffffff" color="white" align="center">
       <font face="Arial" size="2"><strong>Next Group</strong></font>
       <Input id='nextButton' alt="Next" Type="image" src="/eiv/images/next.gif" Value="     
       Next &gt;&gt;" name="nextButton" ACCESSKEY="B"></td>
    </tr>
    <tr>
       <td align="center" colspan="2"><font face="arial" size="2"><b>51 to 100 of 10151</b></font>
       </td>
    </tr>
</tbody>
</table>