加入表格以编排课件

1第5章 加入表格以編排頁面表格的組成表格的組成 版面表格效果版面表格效果表格建立方式表格建立方式表格的編輯操作表格的編輯操作美化表格外觀美化表格外觀排序表格資料排序表格資料第5章加入表格以編排頁面表格的組成2表格的組成表格是一種由縱欄及橫列所交叉組合而成的方格效果，適用於放置具有條理及結構性的資料內容，圖中即為表格中各個部份的名稱。5-1 表格的組成表格的組成二個儲存格之間的距離稱為間距表格中的每一個方格稱為儲存格最外圍的青色框線稱為表格的邊框儲存格內容和儲存格外框的距離稱為內距橫向的排列稱為列，而本圖中的表格就有三列縱向的排列稱為欄，而本圖中的表格就有四欄表格的組成表格是一種由縱欄及橫列所交叉組合而成的方格效果，適3基本表格建立5-2 表格建立方式表格建立方式 1.輸入表格相關設定2.頁首樣式選擇兩者皆有3.輸入註解文字1.開啟範例檔2.點選插入/表格圖示鈕基本表格建立5-2表格建立方式1.輸入表格相關設定245-2 表格建立方式表格建立方式 建立完成的表格在表格中輸入文字。在輸入的同時，儲存格寬度會自動調整。5-2表格建立方式建立完成的表格在表格中輸入文字。在5表格資料的匯入(1)匯入匯入Excel資料資料5-2 表格建立方式表格建立方式 1.開啟空白網頁2.執行匯入/Excel文件表格資料的匯入(1)匯入Excel資料5-2表格建立65-2 表格建立方式表格建立方式 2.指定格式化為文字、結構、完整格式匯入完成的Excel資料1.點選範例檔5-2表格建立方式2.指定格式化為文字、結構、完7表格資料的匯入(2)匯入表格式資料匯入表格式資料 5-2 表格建立方式表格建立方式 執行功能表中的檔案/匯入/表格式資料指令表格資料的匯入(2)匯入表格式資料5-2表格建立方式85-2 表格建立方式表格建立方式 匯入完成的純文字檔案按下瀏覽鍵5-2表格建立方式匯入完成的純文字檔案按下瀏覽鍵9表格選取技巧儲存格範圍的選取儲存格範圍的選取1.不連續選取不連續選取進行不連續選取時要搭配Ctrl鍵。5-3 表格的編輯操作表格的編輯操作先點取第1個儲存格按住Ctrl鍵後再點取其他儲存格，就可以進行不連續的儲存格選取。表格選取技巧儲存格範圍的選取5-3表格的編輯操作102.連續選取連續選取要進行連續選取時則要使用Shift鍵。5-3 表格的編輯操作表格的編輯操作按住Shift鍵後再點取其他儲存格就可以進行連續的儲存格選取先點取第1個儲存格2.連續選取5-3表格的編輯操作按住Shift鍵113.整欄、整列及表格的選取整欄、整列及表格的選取 5-3 表格的編輯操作表格的編輯操作點取此處可選取整個表格點取此處可選取整欄點取此處可選取整列3.整欄、整列及表格的選取5-3表格的編輯操作點取此12表格編輯功能(1)重設表格的欄數及列數重設表格的欄數及列數5-3 表格的編輯操作表格的編輯操作先點選整個表格再從屬性面板中重新調表格的欄數及列數表格編輯功能(1)重設表格的欄數及列數5-3表格的編輯13表格編輯功能(2)調整表格寬度調整表格寬度5-3 表格的編輯操作表格的編輯操作1先點選整個表格再設定表格的寬度表格編輯功能(2)調整表格寬度5-3表格的編輯操作先點14表格編輯功能(3)內距、間距及邊框的調整內距、間距及邊框的調整5-3 表格的編輯操作表格的編輯操作再從此處進行設定先點選整個表格表格編輯功能(3)內距、間距及邊框的調整5-3表格的編15表格編輯功能(4)欄列的插入與刪除欄列的插入與刪除1.利用插入列利用插入列5-3 表格的編輯操作表格的編輯操作先點取此儲存格位置 表格編輯功能(4)欄列的插入與刪除5-3表格的編輯操作先16在插入列中有四個按鈕可用來新增欄或列5-3 表格的編輯操作表格的編輯操作1.按下此圖示鈕2.新增完成的表格列在目前所點取的儲存格上方新增一列。在目前所點取的儲存格左方新增一欄。在目前所點取的儲存格下方新增一列。在目前所點取的儲存格右方新增一欄。在插入列中有四個按鈕可用來新增欄或列5-3表格的編輯操172.利用標題選單利用標題選單5-3 表格的編輯操作表格的編輯操作插入完成的欄2.再選擇要插入欄的方式1.先點取此箭頭以顯示欄標題選單2.利用標題選單5-3表格的編輯操作插入完成的欄2.再選18表格編輯功能(5)調整欄寬及列高調整欄寬及列高1.手動拖曳手動拖曳5-3 表格的編輯操作表格的編輯操作按此拖曳可調整欄寬或列高 表格編輯功能(5)調整欄寬及列高5-3表格的編輯操作按此192.數值設定數值設定調整欄寬5-3 表格的編輯操作表格的編輯操作2.再輸入寬度數字1.先選取整欄2.數值設定5-3表格的編輯操作2.再輸入寬度數字1.先20調整列高5-3 表格的編輯操作表格的編輯操作1.先選取整列2.再輸入高度數字調整列高5-3表格的編輯操作1.先選取整列2.再輸入213.欄寬設定時的注意事項欄寬設定時的注意事項5-3 表格的編輯操作表格的編輯操作表格剛建立好時其欄寬會自動分配若將第1欄的寬度設為150時剩下欄寬會自動均分3.欄寬設定時的注意事項5-3表格的編輯操作表格剛建22表格編輯功能(6)儲存格的分割及合併儲存格的分割及合併1.合併儲存格合併儲存格5-3 表格的編輯操作表格的編輯操作合併完成的結果2.再點取此圖示1.先選取要合併的儲存格範圍表格編輯功能(6)儲存格的分割及合併5-3表格的編輯操232.分割儲存格分割儲存格5-3 表格的編輯操作表格的編輯操作Dreamweaver會以合併儲存格的方式來處理分割結果，而不是從中間分割為2列。2.再點取此圖示1.先點取要分割的儲存格2.分割儲存格5-3表格的編輯操作Dreamweaver24表格編輯功能(7)清除表格的寬度及亮度清除表格的寬度及亮度1.清除寬度清除寬度5-3 表格的編輯操作表格的編輯操作2.再點取屬性面板上的圖示寬度清除後的結果1.先點取要設定的表格表格編輯功能(7)清除表格的寬度及亮度5-3表格的編輯252.清除高度清除高度5-3 表格的編輯操作表格的編輯操作2.再點取屬性面板上的圖示1.先點取要設定的表格高度清除後的結果2.清除高度5-3表格的編輯操作2.再點取屬性面板上的26表格編輯功能(8)儲存格的其他設定儲存格的其他設定 5-3 表格的編輯操作表格的編輯操作勾選啟用表頭的儲存格，其文字內容會變為粗體及置中對齊。設定此儲存格的文字內容會在同一行顯示，若遇到欄寬不夠時會自動調整欄寬以配合文字內容。調整儲存格內資料的垂直對齊方式。調整儲存格內資料的水平對齊方式。表格編輯功能(8)儲存格的其他設定5-3表格的編輯操作27美化表格外觀5-4 美化表格外觀美化表格外觀2.設定儲存格的外框色及底色1.先點選整列2.設定表格的外框色及底色1.先點選整個表格美化表格外觀5-4美化表格外觀2.設定儲存格的外框色及28排序表格資料5-5 排序表格資料排序表格資料 1.選取整個表格2.執行命令/表格排序指令排序表格資料5-5排序表格資料1.選取整個表格2.295-5 排序表格資料排序表格資料 設定條件如畫面員工已依地區欄位排序；同一地區員工則再依部門做排序。員工已依地區欄位排序；同一地區員工則再依部門做排序。5-5排序表格資料設定條件如畫面員工已依地區欄位30繪製版面表格5-6 版面表格效果版面表格效果在插入列中點選版面/繪製版面表格圖示執行檢視/表格模式/版面模式指令，切換到版面模式。繪製版面表格5-6版面表格效果在插入列中點選版面315-6 版面表格效果版面表格效果繪製完成的版面表格在畫面上拖曳繪製版面表格可用於調整版面表格的大小目前的頁面是處於版面模式5-6版面表格效果繪製完成的版面表格在畫面上拖曳繪製版32繪製版面儲存格5-6 版面表格效果版面表格效果在插入列中點選版面/繪製版面儲存格圖示在畫面上拖曳繪製版面儲存格。繪製版面儲存格5-6版面表格效果在插入列中點選335-6 版面表格效果版面表格效果繪製完成的版面儲存格5-6版面表格效果繪製完成的版面儲存格34調整版面儲存格(1)1.縮放版面儲存格縮放版面儲存格5-6 版面表格效果版面表格效果2.拖曳可縮放版面儲存格的大小1.先點取版面儲存格的邊框調整版面儲存格(1)1.縮放版面儲存格5-6版面表格35調整版面儲存格(2)2.移動版面儲存格移動版面儲存格5-6 版面表格效果版面表格效果按住邊框進行拖曳，可調整版面儲存格的位置。移動之後的版面儲存格調整版面儲存格(2)2.移動版面儲存格5-6版面表格效36調整版面儲存格(3)3.版面儲存格增加與刪除版面儲存格增加與刪除 5-6 版面表格效果版面表格效果點選插入列的版面/繪製版面儲存格鈕在表格中拖曳出儲存格範圍調整版面儲存格(3)3.版面儲存格增加與刪除5-6版面375-6 版面表格效果版面表格效果若要刪除儲存格，則先點選該儲存格，再按下Delete鍵。儲存格被刪除了5-6版面表格效果若要刪除儲存格，則先點選該儲存格，38編輯版面儲存格的內容5-6 版面表格效果版面表格效果內容會正常顯示在版面儲存格中輸入文字按此鈕回到標準模式編輯版面儲存格的內容5-6版面表格效果內容會正常顯示在39應用範例-成績查詢的網頁設計(1)5-6 版面表格效果版面表格效果應用範例-成績查詢的網頁設計(1)5-6版面表格效40應用範例-成績查詢的網頁設計(2)設定網頁背景設定網頁背景5-6 版面表格效果版面表格效果2.指定背景圖檔3.點選不重複1.點選外觀項目執行修改/頁面屬性指令應用範例-成績查詢的網頁設計(2)設定網頁背景5-6415-6 版面表格效果版面表格效果完成背景圖設定5-6版面表格效果完成背景圖設定42應用範例-成績查詢的網頁設計(3)加入表格資料加入表格資料 5-6 版面表格效果版面表格效果執行插入/表格物件/匯入表格式資料利用Enter鍵以增加段落範圍應用範例-成績查詢的網頁設計(3)加入表格資料5-6435-6 版面表格效果版面表格效果加入之後的表格內容點取選擇成績查詢.txt5-6版面表格效果加入之後的表格內容點取選擇成績查詢44應用範例-成績查詢的網頁設計(4)使用表格排序來建立名次使用表格排序來建立名次5-6 版面表格效果版面表格效果應用範例-成績查詢的網頁設計(4)使用表格排序來建立名次455-6 版面表格效果版面表格效果排序完成的畫面先設定如畫面上所示（因為平均成績在第7個欄位）5-6版面表格效果排序完成的畫面先設定如畫面上所示（因46應用範例-成績查詢的網頁設計(5)美化表格美化表格 5-6 版面表格效果版面表格效果2.設定邊框為2，並選擇背景顏色及邊框顏色。1.選取整個表格應用範例-成績查詢的網頁設計(5)美化表格5-6版475-6 版面表格效果版面表格效果2.指定第一列為表頭3.字體大小設為大4.選擇表頭列的背景顏色1.選取第一列5-6版面表格效果2.指定第一列為表頭3.字體