創建兩個表垂直對齊

我想下面的第二個標題，與第一標題垂直隨着第二標題下的其他表保持一致，但我不能找到一個合適的辦法做到這一點，我在互聯網上搜索了一些信息，但仍然無法使用。

這裏是我的HTML代碼示例：

<html> 
    <head> 
     <meta http=equiv="content-Type" content="text/html; charset-utf-8"/> 
     <title>Payments</title> 
    </head> 
    <style type="text/css"> 
     #wrap { 
      width: 460px; 
     } 
    </style> 
    <body> 
     <h5 style="text-align:left"></br></br>PROVIDENCE 
      MEMORIAL PARK-SAN JOSE DEL MONTE BULACAN <p></p> 
      OFFICIAL PRICE LIST effective May 10, 2013</h5> 
    </body> 
    <table border="$" cellpadding="10" width="400"> 
     <tr> 
      <th>Lot type</td> 
      <th>Lot price</td> 
      <th>Mem'rl maintenance fund</td> 
      <th>Total price</td> 
     </tr> 
    </table> 
    <table border="$" cellpadding="10" width="400" > 
     <tr> 
      LAWN LOT 1 (Reflection of Life & Evergreen 

      Mem'ries) 
      <td height="20">Regular</td> 
      <td height="20">40,000.00</td> 
      <td height="20">4,500.00</td> 
      <td height="20">44,500.00</td> 
     </tr> 
     <tr> 
      <td>Special</td> 
      <td>42,000.00</td> 
      <td>4,500.00</td> 
      <td>46,500.00</td> 
     </tr> 
     <tr> 
      <td>Premium</td> 
      <td>46,000.00</td> 
      <td>4,500.00</td> 
      <td>50,500.00</td> 
     </tr> 
    </tr> 
</table> 
<table border="$" cellpadding="10" width="400"> 
    <tr> 
     LAWN 2 LOTS (Eternal Devotion) 
     <td>Regular</td> 
     <td>87,000.00</td> 
     <td>10,000.00</td> 
     <td>97,000.00</td> 
    </tr> 
    <tr> 
     <td>Special</td> 
     <td>93,000.00</td> 
     <td>10,000.00</td> 
     <td>103,000.00</td> 
    </tr> 
    <tr> 
     <td>Premium</td> 
     <td>98,000.00</td> 
     <td>10,000.00</td> 
     <td>10,000.00</td> 
    </tr> 
</tr> 
</table> 
<table border="$" cellpadding="10" width="400"> 
    <tr> 
     COURT 4 LOTS (Court of serenity) 
     <td>Regular</td> 
     <td>157,000.00</td> 
     <td>20,000.00</td> 
     <td>177,000.00</td> 
    </tr> 
    <tr> 
     <td>Special</td> 
     <td>168,000.00</td> 
     <td>20,000.00</td> 
     <td>188,000.00</td> 
    </tr> 
    <tr> 
     <td>Premium</td> 
     <td>180,000.00</td> 
     <td>20,000.00</td> 
     <td>200,000.00</td> 
    </tr> 
</tr> 
</table> 
<table border="$" cellpadding="10" width="400"> 
    <tr style="margin-top:10px;"></tr> 
    <tr> 
     <th>Lot type</td> 
     <th>Lot price</td> 
     <th>Mem'rl maintenance fund</td> 
     <th>Total price</td> 
    </tr> 
</table> 
<table border="$" cellpadding="10" width="400"> 
    <tr> 
     COURT 8 LOTS (Court of tranquility) 
     <td>Regular</td> 
     <td>348,000.00</td> 
     <td>40,000.00</td> 
     <td>388,000.00</td> 
    </tr> 
    <tr> 
     <td>Special</td> 
     <td>369,000.00</td> 
     <td>40,000.00</td> 
     <td>409,000.00</td> 
    </tr> 
    <tr> 
     <td>Premium</td> 
     <td>392,000.00</td> 
     <td>40,000.00</td> 
     <td>432,000.00</td> 
    </tr> 
</tr> 
</table> 
<table border="$" cellpadding="10" width="400"> 
    <tr> 
     ESTATE 12 LOTS (Piety Estate) 
     <td>Premium</td> 
     <td>646,000.00</td> 
     <td>60,000.00</td> 
     <td>706,000.00</td> 
    </tr> 
</table> 
<table border="$" cellpadding="10" width="400"> 
    <tr> 
     ESTATE 18 LOTS (Harmony Estate) 
     <td>Premium</td> 
     <td>968,000,00</td> 
     <td>90,000,00</td> 
     <td>1,058,000.00</td> 
    </tr> 
</table> 
<table border="$" cellpadding="10" width="400"> 
    <tr> 
     ESTATE 24 LOTS (Solace Estate) 
     <td>Premium</td> 
     <td>1,218,000.00</td> 
     <td>120,000.00</td> 
     <td>1,388,000.00</td> 
    </tr> 
</table> 
</body> 
</html>

任何建議將讚賞:)

來源

2014-01-17 user2123999

HTML文件只能有** ONE **''。你的html是無效的 - 你不能有''以外的任何「內容」。 –

我正在學習HTML作爲一個初學者，感謝信息還有很多我不知道HTML的東西:) – user2123999

@ user2123999你能解釋一下你的目標/問題嗎？ –

如何像這樣FIDDLE。

CSS

table { 
    width: 500px; 
    border-collapse: collapse; 
} 
td, th { 
    border-collapse: collapse; 
    text-align: center; 
}

這裏我就不再重複了HTML，但教學點是：

一旦你放在一起（結構和內容）的表，它的風格與CSS。

全部<td>應以</td>結束。所有<th>應以</th>結尾。

<td colspan='4'></td>會給你一個4列寬的單。

來源

2014-01-17 04:11:58 TimSPQR

@TimPQR謝謝！我會嘗試。 – user2123999

創建兩個表垂直對齊

回答

相關問題