組合標簽表格table
阿新 • • 發佈:2018-06-20
邊距 row sed cell 結構 body gre 標簽 http
基本結構
<table border = "1" >
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr》
</table>
table屬性 : border 邊框 width 寬度 cellpadding 邊距 cellspacing間距
表格寬度默認按照內容來,設置為100%會隨著網頁的縮放而縮放
邊距是內容和邊框的距離
間距是單元格和單元格的距離
<tr>是行 <td>是列的屬性
weigh 寬度
hight 高度
align 對齊方式
其他標簽<th> 表頭<td>這兩個標簽是同級標簽
合並單元格(單元格的屬性)
橫向合並(向右合並):colspan
垂直(向下合並):rowspan
嵌套 在一個單元格內嵌套如一個新的表格
代碼:
1 <body> 2table<h3>表格</h3> 3 <table border="1" cellpadding="10" cellspacing="0"> 4 <!--cellpadding內容的距離邊距,cellspacing間距間距為0時只有一條線顯示,border邊框--> 5 <!--表格標題--> 6 <caption>我的表格</caption> 7 <tr> 8 <!--<th>表頭單元格--> 9 <th colspan="2" rowspan="2">表格1</th> 10 <!--colspan 合並行,rowspan合並列--> 11 <th >表格2</th> 12 </tr> 13 <tr> 14 <td>表格4</td> 15 </tr> 16 <tr> 17 <td>1</td> 18 <td>2</td> 19 <td>3</td> 20 </tr> 21 </table> 22 <br> 23 <br> 24 <table border="1" bgcolor="green" width="300" height="300"> 25 <!--bgcolor 顏色--> 26 <tr> 27 <td colspan="2">a</td> 28 <td rowspan="2">b</td> 29 </tr> 30 <tr> 31 <td rowspan="2">c</td> 32 <td></td> 33 </tr> 34 <tr> 35 <td colspan="2">d</td> 36 </tr> 37 38 </table> 39 </body>
運行效果
<body> <h3>表格</h3> <table border="1" cellpadding="10" cellspacing="0"> <!--cellpadding內容的距離邊距,cellspacing間距間距為0時只有一條線顯示--> <caption>我的表格</caption> <tr> <th colspan="2" rowspan="2">表格1</th> <th >表格2</th> </tr> <tr> <td>表格4</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> </table> <br> <br> <table border="1" cellspacing="0" bgcolor="green" width="300" height="300"> <tr> <td colspan="2">a</td> <td rowspan="2">b</td> </tr> <tr> <td rowspan="2">c</td> <td></td> </tr> <tr> <td colspan="2">d</td> </tr> </tabl運行效果
組合標簽表格table