HTML中怎樣通過表格標(biāo)記創(chuàng)建表格？

更新時(shí)間:2023-06-05 來源:黑馬程序員瀏覽量:

IT培訓(xùn)班

在制作網(wǎng)頁時(shí)，為了使網(wǎng)頁中的數(shù)據(jù)能夠有條理地顯示，可以使用表格對(duì)網(wǎng)頁進(jìn)行規(guī)劃。在Word文檔中，可通過播入表格的方式來創(chuàng)建表格，而在HTML網(wǎng)頁中要想創(chuàng)建表格，需要使用相關(guān)的表格標(biāo)記才能創(chuàng)建表格。在HTML網(wǎng)頁中創(chuàng)建表格的基本語法格式如下所示。

在HTML網(wǎng)頁中創(chuàng)建表格的基本語法格式如下所示。

<table>
    <tr>
        <td>單元格內(nèi)的文字</td>
    </tr>
</table>

在上述的語法中，包含3對(duì)HTML標(biāo)記，分別為<table></table>、<tr></tr>、<td></td>，它們是創(chuàng)建表格的基本標(biāo)記，缺一不可。<table></table>用于定義一個(gè)表格；<tr></tr>用于定義表格中的行，必須嵌套在<table></table>標(biāo)記中，<td></td>用于定義表格中的單元格，也可稱為表格中的列，必須嵌套在<tr></tr>標(biāo)記中。接下來，通過一個(gè)案例來演示<table>標(biāo)記的使用。在chapter01文件夾中創(chuàng)建一個(gè)HTML文件htmlDemo05,其關(guān)鍵代碼如文件所示。

<body>
<table border="1">
    <tr>
        <td>姓名</td>
        <td>語文</td>
        <td>數(shù)學(xué)</td>
        <td>英語</td>
    </tr>
    <tr>
        <td>itcast</td>
        <td>95</td>
        <td>80</td>
        <td>90</td>
    </tr>
</table>
</body>

標(biāo)記的border 屬性會(huì)為每個(gè)單元格應(yīng)用邊框，并用邊框圍繞表格。這里將 border 的屬性設(shè)置為1,單位是像素，表示該表格邊框的寬度為1像素。如果 border 屬性的值發(fā)生改變，那么只有圍繞表格的邊框尺寸會(huì)發(fā)生變化，表格內(nèi)部的邊框還是1像素寬。如果將border的屬性值設(shè)置為0或者刪除border屬性，將顯示沒有邊框的表格。使用瀏覽器打開文件，顯示結(jié)果如圖1所示。

1685945322927_表格.png