亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

HTML表格

每個表格均有若干行(由 < tr> 標簽定義),每行被分割為若干單元格(由 < td> 標簽定義)。字母 td 指表格數(shù)據(jù)(table data),即數(shù)據(jù)單元格的內容。< th>標簽用來定義表頭。數(shù)據(jù)單元格可以包含文本、圖片、列表、段落、表單、水平線、表格等等。

下面我們動手來寫一個簡單HTML文件來練習這幾個標簽:

<html>
<title >表格</title>
<body style="font-size:20px">
    <p style="text-align:center">表格</p>  
     <table  align="center" border="1">  
            <tr>
            <td>第一行和第一列</td>
            <td>第一行和第二列</td>
            <td>第一行和第三列</td>
            </tr>
             <tr>
             <td>第二行和第一列</td>
             <td>第二行和第二列</td>
             <td>第二行和第三列</td>
             </tr>
     </table>   
</body>
</html>

這是實驗截圖:

QQ截圖20161206113742.png

border="1"定義的是最外面邊框粗細,為1,你也可以設置為0,就是不顯示邊框(默認就是沒有邊框)這里我們將其改成15試試:

QQ截圖20161206113812.png

下面我們再介紹表格兩個屬性: colspan:控制此單位所占列數(shù) rowspan:控制此單位所占行數(shù)

<html>
<title >表格</title>
<body style="font-size:30px">
    <p style="text-align:center">表格</p>
     <table  align="center" border="15" >
        <tr>
         <td align="center" colspan="2">第一行和第一列</td>
         </tr>
         <tr>
         <td rowspan="2">第二行和第一列 </td>
            <td>第二行和第二列 </td>
            <td >第二行和第三列</td>
         </tr>
         <tr>
         <td>第三行和第一列 </td>
            <td>第三行和第二列 </td>
         </tr>
        </table>   
</body>
</html>

如果不是很理解,我們就來看看在網頁上的表現(xiàn),對比起來有助于我們理解。 讓第一列第一行這個單位占兩列,讓第二行第一列這個單位占兩行,就是這個效果。

QQ截圖20161206114105.png

表格還有很多細節(jié)可以定義,我們早這里就簡單敘述,大家需要動手練習:

標簽:< th>表頭< /th>:設置表頭

標簽:< caption>標題< /caption>:設置表的標題

屬性:cellpadding="..."設置單元格邊距

屬性:bgcolor="..."設置表格背景顏色

屬性:background="..." 以某張圖片作為表格背景

<table>    定義表格    

<caption>    定義表格標題。    

<th>    定義表格的表頭。    

<tr>    定義表格的行。    

<td>    定義表格單元。    

<thead>    定義表格的頁眉。    

<tbody>    定義表格的主體。    

<tfoot>    定義表格的頁腳。    

<col>    定義用于表格列的屬性。    

<colgroup>    定義表格列的組。    


Weiter lernen
||
<html> <title >表格</title> <body style="font-size:30px"> <p style="text-align:center">表格</p> <table align="center" border="15" > <tr> <td align="center" colspan="2">第一行和第一列</td> </tr> <tr> <td rowspan="2">第二行和第一列 </td> ? <td>第二行和第二列 </td> <td >第二行和第三列</td> </tr> <tr> <td>第三行和第一列 </td> <td>第三行和第二列 </td> </tr> </table> </body> </html>
einreichenCode zurücksetzen