1 / 40

網頁製作 Step By Step

網頁製作 Step By Step. 開新檔案. 檔案→開新檔案→空白網頁. 儲存檔案. 檔案→另存新檔→輸入檔名. 利用表格 - 排版. 表格→插入→表格. 插入 Logo 圖. 插入→圖片→從檔案. 插入間隔圖. 插入→圖片→從檔案（ clear.gif ） 選取圖片→滑鼠右鍵→圖片內容 設定寬度為 207 像素，高度為 1 像素. 插入功能圖. 陸續插入 __04.gif~__07.gif 等圖片. 設定儲存格背景圖. 選取儲存格→滑鼠右鍵→儲存格內容 使用背景圖片（ __17.gif ） 水平對齊方式：靠左 垂直對齊方式：中. 插入橫式選項圖.

kamal
Download Presentation

網頁製作 Step By Step

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. 網頁製作Step By Step 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  2. 開新檔案 • 檔案→開新檔案→空白網頁 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  3. 儲存檔案 • 檔案→另存新檔→輸入檔名 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  4. 利用表格-排版 • 表格→插入→表格 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  5. 插入Logo圖 • 插入→圖片→從檔案 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  6. 插入間隔圖 • 插入→圖片→從檔案（clear.gif） • 選取圖片→滑鼠右鍵→圖片內容 • 設定寬度為207像素，高度為1像素 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  7. 插入功能圖 • 陸續插入__04.gif~__07.gif等圖片 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  8. 設定儲存格背景圖 • 選取儲存格→滑鼠右鍵→儲存格內容 • 使用背景圖片（__17.gif） • 水平對齊方式：靠左 • 垂直對齊方式：中 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  9. 插入橫式選項圖 • 陸續插入__08.gif~__14.gif圖 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  10. 設定儲存格背景色 • 選擇儲存格→儲存格內容→背景→色彩 • 選擇自訂色彩→紅、綠、藍皆設定153 • 插入圖片（clear.gif） 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  11. 預備直式選單 • 插入表格（1X3） 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  12. 設定儲存格寬度 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  13. 插入表格 • 插入表格（2X1） 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  14. 設定儲存格內容 • 高度2 • 插入clear.gif圖（寬164、高15） 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  15. 設定儲存格內容 • 寬度164 • 水平對齊：置中 • 垂直對齊：上 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  16. 插入直式選單圖片 • 依序插入__37.gif、__39.gif、__40.gif、__41.gif、__44.gif、__55.gif、__56.gif、__57.gif、__58.gif、__59.gif、__60.gif、__66.gif 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  17. 設定儲存格格式 • 寬度1 • 自訂色彩 • 插入clear.gif圖 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  18. 設定儲存格格式 • 寬度587 • 水平對齊：靠左 • 垂直對齊：靠上 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  19. 插入表格 • 插入7X1 • 寬度585 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  20. 設定儲存格格式 • 高度3 • 插入clear.gif（寬度3、高度1） 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  21. 設定儲存格：置中對齊 • 插入圖片：__27.gif 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  22. 插入圖片：__43.gif 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  23. 設定儲存格背景顏色：238、238、238 • 插入圖片：clear.guf（寬度18、高度1） 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  24. 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  25. 設定儲存格格式 • 背景色：238、238、238 • 插入圖：clear.gif（寬18、高1） 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  26. 設定儲存格格式 • 寬度：128 • 水平：置中 • 垂直：靠上 • 背景色：238、238、238 • 圖片：__47.gif 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  27. 設定儲存格格式 • 寬度：13 • 背景色：238、238、238 • 插入圖：clear.gif（寬13、高1） 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  28. 重複上述動作 • 陸續插入__49.gif、__51.gif、__53.gif 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  29. 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  30. 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  31. 插入表格 • 表格：1列X3欄 • 寬度：585 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  32. 設定儲存格格格式 • 寬度：8 • 圖片：clear.gif（寬8、高1） 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  33. 設定儲存格格式 • 寬度：134 • 垂直：靠上 • 圖片：__68.gif 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  34. 設定儲存格格式 • 水平：靠左 • 垂直：靠上 • 插入表格：3列X1欄 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  35. 設定儲存格 • 水平：靠左 • 垂直：靠上 • 插入圖片：__69.gif 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  36. 設定儲存格 • 高度：8px • 插入圖片：clear.gif(寬度1*高度8) 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  37. 插入表格 • 1X3 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  38. 設定儲存格 • 寬度：17 • 插入圖片：clear.gif(寬度17、高度1) 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  39. 設定儲存格 • 寬度1 • 背景圖：__75.gif • 插入圖片：clear.gif 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

  40. 完成圖 國立高雄大學-圖書資訊館 楊國棟 kdyang@nuk.edu.tw

More Related