使用表格市公開(kāi)課一等獎(jiǎng)省賽課獲獎(jiǎng)?wù)n件_第1頁(yè)
使用表格市公開(kāi)課一等獎(jiǎng)省賽課獲獎(jiǎng)?wù)n件_第2頁(yè)
使用表格市公開(kāi)課一等獎(jiǎng)省賽課獲獎(jiǎng)?wù)n件_第3頁(yè)
使用表格市公開(kāi)課一等獎(jiǎng)省賽課獲獎(jiǎng)?wù)n件_第4頁(yè)
使用表格市公開(kāi)課一等獎(jiǎng)省賽課獲獎(jiǎng)?wù)n件_第5頁(yè)
已閱讀5頁(yè)，還剩9頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

網(wǎng)頁(yè)設(shè)計(jì)與觀賞

第8章使用表格佳木斯大學(xué)陳春蕾>使用表格第1頁(yè)一、創(chuàng)建表格（一）創(chuàng)建一個(gè)普通表格應(yīng)包含標(biāo)識(shí)標(biāo)識(shí)1.<TABLE></TABLE>:定義整個(gè)表格，表格全部?jī)?nèi)容都位于該標(biāo)識(shí)內(nèi)。2.<CAPTION></CAPTION>:定義表格標(biāo)題，其慣用屬性是align，取值以下：

1）top：在表格上部（默認(rèn)值）

2）bottom：在表格下部

3）left：在表格上部左側(cè)

4）right：在表格上部右側(cè)3.<TR></TR>：定義表格中行，且一對(duì)<TR></TR>只能定義一行4.<TH></TH>：定義表格中表頭單元格5.<TD></TD>：定義每行中各個(gè)單元格，行中有多少個(gè)單元格，就有多少個(gè)<TD>

第8章使用表格

創(chuàng)建表格使用表格第2頁(yè)（二）合并單元格1.行合并：在<TD>或<TH>內(nèi)使用rowspan屬性（跨越行數(shù)）2.列合并：在<TD>或<TH>內(nèi)使用colspan屬性（跨越列數(shù)）（三）創(chuàng)建表格步驟1.先使用<TABLE>，若需要標(biāo)題，則在<TABLE>后使用<CAPTION>；2.使用<TR>畫(huà)第一行；3.使用<TD>或<TH>定義該行上各列單元格；（1）若碰到跨行單元格，則用rowspan屬性，且在首次出現(xiàn)行中使用rowspan（2）若碰到跨列單元格，則用colspan進(jìn)行合并4.重復(fù)步驟2－3，依次畫(huà)出每一行，直到表格結(jié)束。創(chuàng)建表格第8章使用表格使用表格第3頁(yè)<table>標(biāo)簽屬性有：

width（寬度）height（高度）bgcolor（背景顏色）background（表格背景圖片）border（邊框?qū)挾龋゜ordercolor（邊框顏色）bordercolorlight（邊框明亮部分顏色）bordercolordark（邊框昏暗部分顏色）cellspacing（單元格邊距）cellpadding（單元格填充距）align（對(duì)齊方式）使用表格第4頁(yè)<TR>標(biāo)簽屬性有：align(水平對(duì)齊方式）valign（垂直對(duì)齊方式）bgcolor（行背景顏色）bordercolor（邊框顏色）bordercolorlight（邊框明亮部分顏色）bordercolordark（邊框昏暗部分顏色）使用表格第5頁(yè)<TD>標(biāo)簽屬性有：Align（水平對(duì)齊方式）valign（垂直對(duì)齊方式）width（寬度）height（高度）bgcolor（單元格背景色）colspan（跨占列數(shù)，缺省值為1)rowspan（跨占行數(shù)，缺省值為1）使用表格第6頁(yè)二、表格對(duì)齊1.表格在頁(yè)面中對(duì)齊：（1）直接在<TABLE>中使用align屬性（2）將<TABLE>放在<DIV

align=“”>與</DIV>之間2.表格內(nèi)容水平對(duì)齊：在<TR>、<TH>、<TD>內(nèi)使用align屬性3.表格內(nèi)容垂直對(duì)齊：在<TR>、<TH>、<TD>內(nèi)使用valign屬性（取值為top/middle\bottom）創(chuàng)建表格第8章使用表格使用表格第7頁(yè)三、使用表格設(shè)計(jì)網(wǎng)頁(yè)布局（一）控制表格和單元格大小使用width和height屬性來(lái)定義表格或單元格大小，其取值能夠是象素或百分比。例：<html><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>控制表格和單元格大小</title></head><body><tableborderaligh="center"><trheight="400"><tdwidth="200"> <tdwidth="300"> <tdwidth="200"> <tr><tdcolspan="3"height="100"> </table></body></html>第8章使用表格使用表格第8頁(yè)第3章文字與段落（二）設(shè)置表格及單元格背景能夠在<TABLE>、<TR>、<TH>、<TD>等標(biāo)識(shí)內(nèi)使用bgcolor或background屬性來(lái)定義背景色或背景圖片。（三）使用嵌套表格在給頁(yè)面布局時(shí)，非常有效一個(gè)方法就是將表格嵌套。只要將表格作為一個(gè)單元格內(nèi)容，放在<TD>與</TD>之間即可。例：<html><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>使用嵌套表格</title></head><body><tablealign=centercellspacing=0cellpadding=0width=619><tr><tdalign="left"height=30bgcolor="blue"><p><fontsize=2color=white>  當(dāng)前位置：

<ahref="#"><fontcolor=white>首頁(yè)</font></a>>

<ahref="#"><fontcolor=white>新聞</font></a>>

<ahref="#"><fontcolor=white>個(gè)人天地</font></a>>使用表格第9頁(yè)<tr><tdalign="middle"valign="top"height="345"><br><tablebordercellspacing=0cellpadding=5width=606><tr><tdheight=253width=85bgcolor="99ccff"> <tdvalign="top"height="253"width="495"><br><p>在線聽(tīng)歌：

<ul><li><ahref="#">一千年以后</a><li><ahref="#">女人花</a><li><ahref="#">只要有你</a>

</ul>

</table>

<palign=center><fontsize=2>|<ahref="#">首頁(yè)</a>|<ahref="#">網(wǎng)頁(yè)制作</a>|<ahref="#">讀者服務(wù)</a>|<ahref="#">聯(lián)絡(luò)我們</a></font></table></body></html>使用表格第10頁(yè)四、表格布局綜合應(yīng)用在很多網(wǎng)頁(yè)上，經(jīng)常使用各種細(xì)線進(jìn)行頁(yè)面布局，從而使頁(yè)面到達(dá)簡(jiǎn)練明快、不呆板效果。（一）表格框線效果制作關(guān)鍵點(diǎn)：1.將<table>中bgcolor屬性設(shè)為要顯示線顏色；2.將<table>中cellspacing屬性設(shè)為細(xì)線粗細(xì)（值為1）；3.將單元格或行bgcolor屬性設(shè)為不一樣于表格<table>中bgcolor值（通常為white）第8章使用表格使用表格第11頁(yè)例：<html><head><title>表格框線效果</title></head><body><tablealign=centercellspacing=1cellpadding=5bgcolor="pink"><trbgcolor="white"><tdwidth=200align=center><b>我們與時(shí)間</b>

<trbgcolor="white"><tdalign=middle>年月日時(shí)分秒，<br><br>是我們給時(shí)間定義單位，<br><br>也是時(shí)間度量我們生命尺度。<br><br>有些人說(shuō)，時(shí)間飛逝，<br><br>錯(cuò)矣！<br><br>時(shí)間永恒，是我們離去！<br><br>

</table></body></html>第8章使用表格使用表格第12頁(yè)（二）橫豎分隔線效果制作關(guān)鍵點(diǎn)：1.將<table>中cellspacing=0cellpadding=0；2.將要做為細(xì)線單元格bgcolor屬性設(shè)為細(xì)線顏色；3.將單元格width屬性（豎線）或height（橫線）設(shè)為細(xì)線粗細(xì)，為1（該單元格中不能有任何內(nèi)容）。第8章使用表格使用表格第13頁(yè)例：<html><head><title>橫豎分隔線效果</title></head><body><tablealign=centercellspacing=0cellpadding=0><trheight=100><tdwidth=100> <tdwidth=1bgcolor=black><tdwidth=600><h1align=center><fontface=幼圓>良言</font></h1><trheight=1><tdcolspan=3bgcolor=black><trheight=300><tdwidth=100> <tdwidth=1bgcolor=black><td

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

最新文檔

評(píng)論

0/150

提交評(píng)論