常用嵌套表格示例,出自《網頁開發手記:HTML+CSS+JavaScript實戰詳解》
| <html> | |
| <head> | |
| <title>嵌套表格布局網頁</title> | |
| </head> | |
| <body topmargin="0" bottommargin="0"> | |
| <table width="500" height="400" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#999999"> | |
| <tr> | |
| <td height="100"><table width="100%" height="100%" border="0" cellspacing="2"> | |
| <tr> | |
| <td width="112" align="center" bgcolor="#CCCCCC">企業標志</td> | |
| <td align="center">企業宣傳動畫</td> | |
| <td width="120"><table width="100%" height="100" border="0"> | |
| <tr> | |
| <td>Email聯系我們</td> | |
| </tr> | |
| <tr> | |
| <td>業務電話:</td> | |
| </tr> | |
| <tr> | |
| <td>公司地址:</td> | |
| </tr> | |
| </table></td> | |
| </tr> | |
| </table></td> | |
| </tr> | |
| <tr> | |
| <td height="20"><table width="80%" border="0" align="center" cellpadding="0" cellspacing="2"> | |
| <tr align="center"> | |
| <td bgcolor="#CCCCCC">公司首頁</td> | |
| <td>公司介紹</td> | |
| <td>公司產品</td> | |
| <td>公司文化</td> | |
| <td>公司論壇</td> | |
| </tr> | |
| </table></td> | |
| </tr> | |
| <tr> | |
| <td valign="top"><table width="100%" height="100%" border="0"> | |
| <tr> | |
| <td width="20%" valign="top"><table width="100%" height="200" border="0" bgcolor="#CCCCCC"> | |
| <tr> | |
| <td align="center">文章列表</td> | |
| </tr> | |
| <tr> | |
| <td>1.文章標題1</td> | |
| </tr> | |
| <tr> | |
| <td>2.文章標題2</td> | |
| </tr> | |
| <tr> | |
| <td>3.文章標題3</td> | |
| </tr> | |
| <tr> | |
| <td>4.文章標題4</td> | |
| </tr> | |
| </table></td> | |
| <td valign="top"><table width="100%" height="200" border="0" cellspacing="0"> | |
| <tr> | |
| <td height="45" align="center"><strong>文章標題</strong></td> | |
| </tr> | |
| <tr> | |
| <td valign="top" bgcolor="#cccccc">文章內容</td> | |
| </tr> | |
| </table></td> | |
| </tr> | |
| </table></td> | |
| </tr> | |
| <tr> | |
| <td height="75"><table width="200" border="0" align="center"> | |
| <tr> | |
| <td>網站備案:</td> | |
| </tr> | |
| <tr> | |
| <td>公司信息:</td> | |
| </tr> | |
| <tr> | |
| <td>公司年份:</td> | |
| </tr> | |
| </table></td> | |
| </tr> | |
| </table> | |
| </body> | |
| </html> |
表格效果:

