網(wǎng)頁中的表格

1、網(wǎng)網(wǎng) 頁頁 中中 的的 表表 格格棗莊四十中學(xué) 吳遠(yuǎn)鋒2014.09.242014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒網(wǎng)頁中的表格網(wǎng)頁中的表格學(xué)習(xí)任務(wù)學(xué)習(xí)任務(wù): 學(xué)會(huì)使用表格布局網(wǎng)頁，靈活掌握表格學(xué)會(huì)使用表格布局網(wǎng)頁，靈活掌握表格調(diào)整的方法。調(diào)整的方法。 具體目標(biāo)：具體目標(biāo)： 插入表格、調(diào)整行高和列寬、單元格的插入表格、調(diào)整行高和列寬、單元格的合并與折分、插入或刪除表格中的行或列、合并與折分、插入或刪除表格中的行或列、做成做成P18中間的中間的“試一試試一試”的的“我的情感小我的情感小屋屋”網(wǎng)頁。網(wǎng)頁。 2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒打

2、開，再和我們自己做的網(wǎng)頁比較，看看哪個(gè)網(wǎng)頁整齊，有條理？ 網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒我們會(huì)發(fā)現(xiàn)，我們自己做的網(wǎng)頁看上去也不太好看，而一些網(wǎng)絡(luò)上的網(wǎng)頁，雖然內(nèi)容很多，但看上去，仍然很好，不亂，為什么呢？很簡(jiǎn)單，因?yàn)榇笮途W(wǎng)站網(wǎng)頁的布局上使用了表格布局網(wǎng)頁，內(nèi)容雖然多，但布置的仍然很整齊，這就是網(wǎng)頁表格的妙用。 網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒打開中學(xué)生作文網(wǎng)http:/ ，你看到了哪些和網(wǎng)頁比較顯著的不同？！網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四

3、十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒我們可以看出網(wǎng)頁是由許多線組成的網(wǎng)格劃分成相對(duì)獨(dú)立的區(qū)域，在這些大同小異的區(qū)域中放置了網(wǎng)頁中的不同素材。這些網(wǎng)格被稱作表格，虛線便是表格的邊框。網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒在設(shè)計(jì)網(wǎng)頁時(shí)，通過插入虛線表格、調(diào)整表在設(shè)計(jì)網(wǎng)頁時(shí)，通過插入虛線表格、調(diào)整表格的行高和列寬、設(shè)置單元格的合并和折分格的行高和列寬、設(shè)置單元格的合并和折分等操作，將不同的素材放置到網(wǎng)頁適當(dāng)?shù)奈坏炔僮鳎瑢⒉煌乃夭姆胖玫骄W(wǎng)頁適當(dāng)?shù)奈恢?，使網(wǎng)頁的內(nèi)容排列整齊，層次分明，讓置，使網(wǎng)頁的內(nèi)容排列整齊，層次分明，讓網(wǎng)頁內(nèi)容形成了一個(gè)有機(jī)的整體，也可以插網(wǎng)頁

4、內(nèi)容形成了一個(gè)有機(jī)的整體，也可以插入實(shí)線的表格，發(fā)揮文字、圖片所不能取代入實(shí)線的表格，發(fā)揮文字、圖片所不能取代的特殊作用。的特殊作用。網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒網(wǎng)網(wǎng) 頁頁 中中 的的 表表 格格 2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒插入表格插入表格:插入表格，同時(shí)試著修改成不同的參數(shù)，觀看對(duì)表格的影響。單元格的定位。 網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒表格的調(diào)整：表格的調(diào)整：調(diào)整行高和列寬、單元格的合并與折分、插入或刪除表格中的行或列。(注意：操

5、作的步驟)具體步驟：見P21頁。網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒加油站：如何隱藏表格線加油站：如何隱藏表格線?！網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒我們制作的“我的情感小屋”網(wǎng)頁，如何利用表格工具P18中的“試一試”的那種效果。(注意：我們只做導(dǎo)航欄下面的表格)網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒表格步驟分析：表格步驟分析：首先是三行，然后是四列，第一、二行的一二列合并，用于插入小熊圖片，第一行第三列是“歡迎光臨”，第四列為時(shí)鐘，

6、第二行第三四列合并“我的情感小屋”，第三行第二列、第三列分別是文字，第四列是圖片。網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒制做過程：制做過程：1.插入一個(gè)三行四列的表格。插入一個(gè)三行四列的表格。2.第一二行的第一二單元格合并，用于插入圖片。第一二行的第一二單元格合并，用于插入圖片。3.第二行的第三四合并，用于放入文字。第二行的第三四合并，用于放入文字。4.調(diào)整第三的單元格，如調(diào)整第三的單元格，如P18頁所示。頁所示。5.在對(duì)應(yīng)的表格中分別插入對(duì)應(yīng)的元素。在對(duì)應(yīng)的表格中分別插入對(duì)應(yīng)的元素。6.調(diào)整布局，成調(diào)整布局，成P18所示形狀?；蛘吒烙^一些的所示形狀?；蛘吒烙^一些的形狀。形狀。網(wǎng)頁中的表格網(wǎng)頁中的表格2014.09.24棗莊市第四十中學(xué)棗莊市第四十中學(xué) 吳遠(yuǎn)鋒吳遠(yuǎn)鋒總結(jié)總結(jié):本節(jié)課我們重點(diǎn)學(xué)習(xí)了插入表格、調(diào)整行高本節(jié)課我們重點(diǎn)學(xué)習(xí)了插入表格、調(diào)整行高和列寬、單元格的合并與折分、插入或刪除和列寬、單元格的合并與折分、插入或刪除表格中的