HTML Table tr td th表格標(biāo)簽元素知識(shí)篇

<table表格布局篇，認(rèn)識(shí)html表格基礎(chǔ)語法，認(rèn)識(shí)table表格結(jié)構(gòu)語法，通過html table tr td、html table tr th表格實(shí)例掌握表格認(rèn)識(shí)html表格table樣式布局。同時(shí)table的樣式可以通過CSSyangshi_10628_1.html' target='_blank'>CSS樣式控制其各式各樣的樣式。

html table表格目錄

1. table表格語法與結(jié)構(gòu)
2. table標(biāo)簽使用說明
3. Table表格標(biāo)簽使用場景
4. table表格案例
5. DW軟件輸入表格布局
6. table表格總結(jié)

一、table表格語法與結(jié)構(gòu) - TOP

<table
<tr
<td&nbsp;</td
<td&nbsp;</td
<td&nbsp;</td
</tr
</table

或者

<table
<tr
<th&nbsp;</th
<th&nbsp;</th
<th&nbsp;</th
</tr
</table

以上2個(gè)表格結(jié)構(gòu)中td和th使用，沒有區(qū)別均可使用。

二、table標(biāo)簽使用說明 - TOP

我們學(xué)習(xí)DIV+CSS了，不是就完全放棄丟棄table表格布局。想想我們?yōu)槭裁磳W(xué)習(xí)DIV CSS其中一個(gè)因素，讓布局更簡單、代碼更簡單，所以有時(shí)候我們也需要table表格來布局。
比如，電子表格型的數(shù)據(jù)表格。

三、Table表格標(biāo)簽使用場景 - TOP

這個(gè)是淘寶支付寶頁面里任意截的一張表格運(yùn)用圖片：

html table表格實(shí)際應(yīng)用截圖

四、Table tr td th表格使用案例 - TOP

<tablewidth="300"border="1"cellspacing="0"
<tr
<th班級</th
<th日期</th
<th標(biāo)題</th
</tr
<tr
<td一班</td
<td2012-5-10</td
<td標(biāo)題1</td
</tr
<tr
<td二班</td
<td2012-5-20</td
<td標(biāo)題2</td
</tr
</table

DW軟件里截圖：

table案例教程布局截圖

谷歌瀏覽器效果截圖：

table表格布局案例在瀏覽器中截圖

五、DW軟件輸入表格標(biāo)簽 - TOP

可以在DW軟件中直接輸入你要的表格：

第一步：單擊DW軟件“插入”，然后選擇點(diǎn)擊“表格（T）”

DW布局表格

第二步：在彈出“表格”設(shè)置選項(xiàng)卡，設(shè)置需要表格，行、列、寬度等屬性

DW軟件輸入table布局

第三步：設(shè)置完后，點(diǎn)擊“確定”，即可在DW輸入標(biāo)準(zhǔn)的table表格標(biāo)簽。

六、DIVCSS5對于table表格總結(jié) - TOP

1、表格可以在DW輸入，拖拽調(diào)整
2、table表格實(shí)用于多列數(shù)據(jù)列表
3、學(xué)習(xí)了DIV CSS還得學(xué)習(xí)TABLE
4、table會(huì)使用靈活運(yùn)用即可
5、多列數(shù)據(jù)列表table標(biāo)簽要比使用div css節(jié)約代碼，任意控制內(nèi)容排版

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請第一時(shí)間聯(lián)系我們修改或刪除，多謝。