公開課 網(wǎng)頁制作之表格布局頁面

網(wǎng)頁制作之表格布局頁面計算機部方輝復習舊課Web站點和網(wǎng)頁復習舊課問題：如何建立站點？操作練習導入新課1．掌握表格的創(chuàng)建方法和表格的屬性設置。2．學會使用表格布局頁面的方法和技巧。教學目標教學提綱1．表格布局

掌握表格的創(chuàng)建方法和表格的屬性設置。2．項目任務

學會使用表格布局頁面的方法和技巧。邊學邊練：在游泳中學會游泳！講授新課一、表格布局為了使網(wǎng)頁更加美觀大方，在制作網(wǎng)頁時，需要先對網(wǎng)頁的輪廓進行規(guī)劃，將文字、圖片等網(wǎng)頁元素進行精確定位，這就需要用到網(wǎng)頁的布局。表格布局是目前最常見的網(wǎng)頁布局方式之一，它靈活方便、簡單易學。熟練地使用表格布局是網(wǎng)頁制作的基本要求。1．表格的組成2．創(chuàng)建表格（1）創(chuàng)建表格（2）創(chuàng)建嵌套表格創(chuàng)建嵌套表格就是在已有表格的某單元格中插入新的表格。使用表格的嵌套可以使大量的網(wǎng)頁元素進行復雜的定位，從而整齊地展示在瀏覽者面前，在新浪、網(wǎng)易等綜合性網(wǎng)站中都被普遍使用。3．選擇表格元素要在表格中進行操作，首先需要選擇表格元素，即選擇整個表格、行、列和單元格。（1）選擇整個表格（2）選擇行（3）選擇列（4）選擇單元格4．設置表格屬性

（1）設置表格的屬性

（2）設置單元格的屬性5．表格的基本操作（1）調(diào)整表格的大?。?）調(diào)整行高和列寬（3）插入行或列（4）刪除行或列（5）合并和拆分單元格6．常見頁面布局

網(wǎng)頁導航（分類菜單）網(wǎng)頁導航（分類標題）網(wǎng)頁內(nèi)容網(wǎng)頁導航（分類標題）網(wǎng)頁版權(quán)信息操作練習二、項目任務：時尚雜志網(wǎng)頁1．網(wǎng)頁效果2．項目素材3．操作流程（1）、建立文件夾（2）、建立站點（3）、分析網(wǎng)頁效果圖：素材位置、素材類型、頁面大小、網(wǎng)頁標題（4）、記錄素材大小，如圖像大小尺寸（5）、計算圖像大小進行拼圖設計表格（6）、表格嵌套技巧：由外而內(nèi)，越簡單越好，根據(jù)圖片大小設置單元格寬和高。邊設置單元格大小邊插入圖片，邊插入圖片邊嵌套插入新的表格。（7）、初始表格插入，行列數(shù)越小越好，表格寬度輸入最大圖片寬度800，邊框粗細0，單元格邊距0，單元格間距0。對齊方式為居中對齊。3．操作流程（8）、后續(xù)表格插入與初始表格插入類似，表格寬度可以不設，也可以輸入與其相關(guān)的最大圖片寬度。（9）、可以邊預覽邊修改。修改的重點在于圖片大小與單元格大小、圖片數(shù)量與表格行列設置。（10）、不要期待一次成功，要反復多試。熟能生巧，學習的不是知識，而是要練習出能力。（11）、保存預覽。“文件”→“在瀏覽器中預覽”4．實際操作（1）、建立文件夾（2）、建立站點（3）、分析網(wǎng)頁效果圖：素材位置、素材類型、頁面大小、網(wǎng)頁標題（4）、記錄素材大小，如圖像大小尺寸（5）、計算圖像大小進行拼圖設計表格（6）、表格嵌套技巧：由外而內(nèi)，越簡單越好，根據(jù)圖片大小設置單元格寬和高。邊設置單元格大小邊插入圖片，邊插入圖片邊嵌套插入新的表格。（7）、初始表格插入，行列數(shù)越小越好，表格寬度輸入最大圖片寬度800，邊框粗細0，單元格邊距0，單元格間距0。對齊方式為居中對齊。（8）、后續(xù)表格插入與初始表格插入類似，表格寬度可以不設，也可以輸入與其相關(guān)的最大圖片寬度。（9）、可以邊預覽邊修改。修改的重點在于圖片大小與單元格大小、圖片數(shù)量與表格行列設置。（10）、不要期待一次成功，要反復多試。熟能生巧，學習的不是知識，而是要練習出能力。（11）、保存預覽。“文件”→“在瀏覽器中預覽”操作練習鞏固復習操作關(guān)鍵1、網(wǎng)頁效果及素材分析素材位置、素材類型、頁面大小、網(wǎng)頁標題、素材大?。ㄈ鐖D像大小尺寸）2、表格嵌套技巧由外而內(nèi)，越簡單越好，根據(jù)圖片大小設置單元格寬和高。邊設置單元格大小邊插入圖片，邊插入圖片邊嵌套插入新的表格。

初始表格插入，行列數(shù)越小越好，表格寬度輸入最大圖片寬度800，邊框粗細0，單元格邊距0，單元格間距0。對齊方式為居中對齊。后續(xù)表格插入與初始表格插入類似，表格寬度可以不設，也可以輸入與其相關(guān)的最大圖片寬度。3、修改技巧可以邊預覽邊修改。修改的重點在于圖片大小與單元