1. 程式人生 > >Html中的表格

Html中的表格

屬性設置 顏色 大小 段落 padding ima com order 開頭

表格由<table>標簽來定義。每個表格均有若幹行(由<tr> 標簽定義),每行被分割為若幹單元格(由<td>標簽定義)。

字母 td 指表格數據(table data),即數據單元格的內容。數據單元格可以包含文本、圖片、列表、段落、表單、水平線、表格等等。

HTML 表格的組成

table:包含表格,表格的開始。

tr:表格的行

th:表格的開頭

td:表格的數據

屬性:

cellpadding:表示內容與表格之間的間隙。

cellspacing:單元格之間和單元格與邊框的的間隙。

border:設置邊框,顏色,邊框線,大小等

align:設置內容對齊方式

td跨行跨列通過 rowspan 和colspan來實現

案例 如下圖:

技術分享

代碼中可以看出相關的屬性設置

<table cellpadding="15" cellspacing="11px" border="1" width="600px" align="center">
            <caption><h3>表名稱</h2></caption>
            <tr>
                <th align="left">字段名</th><
th>字段名</th><th>字段名</th> </tr> <tr bgcolor="#008000"> <td align="center">數據</td><td>數據</td><td>數據2</td> </tr> <tr> <td height="88">數據</
td><td>數據</td><td>數據</td> </tr> <tr> <td>數據</td><td colspan="2">數據</td> </tr> <tr> <td>數據s</td><td rowspan="2" valign="bottom">數據</td><td>數據</td> </tr> <tr> <td>數據</td><td>數據</td> </tr> <tr> <td >數據</td> <td> <table width="100%" height="100%" border="1" > <tr> <th>字段名</th><th>字段名</th><th>字段名</th> </tr> <tr bgcolor="#008000"> <td>數據</th><td>數據</td><td>數據2</td> </tr> </table> </td> <td>數據</td> </tr> </table>

Html中的表格