2014-01-17 2 views
0

내가 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> 

:

+1

HTML 문서는 ** ONE ** ''만 가질 수 있습니다. 귀하의 html은 무효입니다. 귀하는 ''이외의 "내용"을 가질 수 없습니다. –

+0

저는 초보자로서 HTML을 배우고 있습니다. 정보 덕분에 HTML에 대해 잘 모르는 많은 것들이 있습니다. – user2123999

+0

@ user2123999 목표/문제를 좀 더 간결하게 설명해 주시겠습니까? –

답변

0

방법이 FIDDLE 같은 약 :

여기 내 샘플 HTML 코드입니다. 내가 여기에 HTML을 반복하지 않을 것이다

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

CSS하지만, 교육의 포인트는

당신이 함께 (구조와 내용) 넣어 테이블을 일단 스타일은 CSS와 함께.

모두 <td></td>으로 끝나야합니다.

모두 <th></th>으로 끝나야합니다.

<td colspan='4'></td> 너비는 4 열입니다.

+0

@TimPQR 감사합니다! 나는 그것을 시도 할 것이다. – user2123999