HTML裡table標籤的使用方法-html教學-PHP中文網

首頁

web前端

html教學

HTML裡table標籤的使用方法

php中世界最好的语言

Nov 22, 2017 am 11:19 AM

html table 使用方法

HTML的table元素是包含tr td th表格標籤元素的，那麼今天我們就來給大家詳細介紹一下表格的佈局以及語法，最後是對錶格的總結經驗，大家也可以借鑒

表格佈局篇，認識html表格基礎語法，認識table表格結構語法，透過html table tr td、html table tr th表格實例掌握表格認識html表格table樣式版面。同時table的樣式可以透過CSS樣式控制其各式各樣的樣式。

html table表目錄

table表格語法與結構

table標籤使用說明

Table表格標籤使用場景

table表格案例

DW軟體輸入表格佈局

table表格總結

table表格語法與結構

<table> 
    <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
    </tr> 
</table> 
<table> 
    <tr> 
        <th> </th> 
        <th> </th> 
        <th> </th> 
    </tr> 
</table>

登入後複製

以上2個表格結構中td和th使用，沒有差別均可使用。

table標籤使用說明

我們學習DIV+CSS了，不是就完全放棄丟棄table表格佈局。想想我們為什麼學習DIV CSS其中一個因素，讓佈局更簡單、程式碼更簡單，所以有時候我們也需要table表來佈局。

例如，電子表格型的資料表格。

Table表格標籤使用情境

table表格實際應用地方

Table tr td th表格使用案例

<table width="300" border="1" cellspacing="0"> 
    <tr> 
        <th>班级</th> 
        <th>日期</th> 
        <th>标题</th> 
    </tr> 
    <tr> 
        <td>一班</td> 
        <td>2012-5-10</td> 
        <td>标题1</td> 
    </tr> 
    <tr> 
        <td>二班</td> 
        <td>2012-5-20</td> 
        <td>标题2</td> 
    </tr> 
</table>

登入後複製

對於table表格總結

#table表格實用於多列資料列表，table會使用靈活運用即可。多列資料列表table標籤要比使用div css節約程式碼，任意控制內容排版