[Table]跨欄跨列語法
| 題目 | |
|---|---|
| 考科 | 國文 |
| 英文 | |
| 數學 | |
要設計出以上table的語法為以下:
<table border="1"><tbody> border:表示邊框粗細
<tr>
<th colspan="2">題目</th> colspan="2" 橫跨兩個欄位
</tr>
<tr>
<th rowspan="3">考科</th> rowspan="3" 橫跨三列 其中tr表示每列，但是
<td>國文</td> (1) 第一個td表示第一列
</tr>
<tr>
<td>英文</td> (2)
</tr>
<tr>
<td>數學</td> (3)
</tr>
</tbody>
</table>
| Name | Expense |
|---|---|
| Trista | 10 |
| Tina | 20 |
| Sum:30 | |
<table border="1" style="border-style:solid;text-align:center">
<tbody>
<tbody>
<tr>
<th>Name</th>
<th>Expense</th>
</tr>
<tr>
<td>Trista</td>
<td>10</td>
</tr>
<tr>
<td>Tina</td>
<td>20</td>
</tr>
<tr>
<td colspan="2">Sum:30</td>
</tr>
</tbody>
</tbody>
</table>
要設計出以上table的語法為以下:
<table border="1" style="border-style:dashed"><tbody>
<tr>
<th colspan="4">個人基本資料</th>
</tr>
<tr>
<th>姓名</th><td>Trista</td><th>Gender</th><td>Girl</td>
</tr>
<tr>
<th rowspan="3">家庭狀況 </th><td>稱謂</td><td>姓名</td><td>性別</td>
</tr>
<tr>
<td>爸</td><td>王大明</td><td>男</td>
</tr>
<tr>
<td>媽</td><td>劉小花</td><td>女</td>
</tr>
<tr>
<th colspan="4">備註:</th>
</tr>
<tr>
<td colspan="4" > 在備註欄位想要塞兩列兩行，方法就是在
<table border="1" width="100%"><tbody> 塞個table進去，想要控制它的寬度，如橘
色標註所示
<tr><th width="70%">興趣</th><td width="30%">打球</td></tr>
<tr><th>專長</th><td>英文</td></tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</tbody>
</table>
| 身高 | 體重 |
|---|---|
| 150 | 目前無資料 |
要設計出以上table為以下語法:
<table width="50%" border="1" style="text-align:center;">
<tr>
<th>身高</th><th>體重</th>
</tr>
<tr>
<td >150</td><td style="letter-spacing: 20px;">目前無資料</td>
</tr> 其中style="letter-spacing: 20px;"表示字與字的間距為20px
</table>
