PAGE本科學生綜合性、設計性實驗設計方案實驗課程名稱webGis實驗名稱網頁制作指導教師及職稱潘先春開課學期2013＿至＿2014＿學年＿上學期云南師范大學旅游與地理科學學院編印實驗名稱：網頁制作實驗時量：一個周小組合作：□是□否成員：宋國俊1、實驗目的：a.了解HHTML中涉及的技術。HTML語言的組成及特點，學會利用HTML語言編輯網頁。了解CSS。了解網站開發的流程。b.掌握如何在Dreamweaver中進行網頁編輯；

掌握Dreamweaver中站點的設置；

掌握網站空間的申請及網頁的上傳。c.掌握常用的文本與段落修飾標記;

掌握超級鏈接標記及其設置；d.掌握網頁制作中常的三種圖像格式；

掌握圖像的格式設置；掌握利用圖像處理軟件（FireWorks）進行圖像的基本處理。e.掌握網頁制作中常見的多媒體類型及特點；

掌握插入媒體的標簽及相應屬性設置，掌握能夠利用網上的軟件進行媒體格式的轉換。f.掌握網頁制作中頁面的而已技術

：表格布局，CSS布局，框架，布局。g.掌握網頁制作中頁最常用的交互工具：表單元素的使用h.熟練的操作Dreamweaver，或者visualstduio制作一個簡單的網頁。2、實驗材料及相關設備：Windowsxp系統Dreamweaver/visualstduio參考資料為Dreamweaver/visualstduio的相關運用操作手冊及實驗教材。3、實驗理論依據或知識背景：Dreamweaver/visualstduio的相關運用操作手冊及實驗教材。和軟件的具體的操作流程4、實驗方法步驟及注意事項：1.利用記事本實現主頁實例。1):在“記事本”中輸入個人網頁的相關文本。(2):選擇“文件”—>“保存”命令，將該文件保存為“主頁.html”，此時該文檔將顯示IE圖標。(3):打開圖標。2.在Dreamweaver中輸入如下代碼：之后打開。.將上面中的內容，利用DreamWeavor完成，并注意在拆分視圖下，觀察它是如何將格式操作變成HTML代碼的。2制作個人網頁的首頁3.制作完成個人主頁網站，至少完成3個頁面。4超鏈接：Dreamwever中提供了“鏈接檢查器”工具用于超鏈接的檢查。在文件面板的任意文件上右擊，在彈出的快捷菜單中選擇“檢查鏈接”“選擇文件/文件夾”命令。可檢查當前選中的文件或文件夾中的超鏈接的工作情況。結果會顯示在“結果”面板“鏈接檢查器”的選項卡中，可以檢查顯示出斷鏈接的情況，在狀態欄中會有該網頁的鏈接情況的統計數據。如果我們選擇“檢查鏈接”我把一個鏈接到了百度，一個鏈接到了自己的qq空間，其它那些電影業鏈接到了相應的網址，只要連網就可以到達相應的網站。5創建網站相冊6在網頁中使用多媒體，我使用了MP3avi，這樣增加了效果1.插入音樂，用bgsound函數選中音樂，再確定。如果是插入背景音樂：（二）使用<embed>標簽：一打開頁面就會自動播放音樂插入Flash動畫:將插入工具欄切換到“常用”模式，單擊“媒體：Flash”按鈕,插入Flash按鈕:將插入工具欄切換到“常用”模式，單擊“媒體：Flash”按鈕旁邊的三角形，在菜單中選擇“媒體：Flash按鈕”按鈕.插入Flash文本:將插入工具欄切換到“常用”模式，單擊“媒體：Flash”按鈕旁邊的三角形，在菜單中選擇“媒體：Flash文本”按鈕在設置屬性；7分別利用表格及CSS技術完成書上的的布局方式。通過管理或新建樣式使用面板組執行窗口——CSS樣式使用窗口——標簽檢查器——CSS屬性面板CSS屬性面板可以設置樣式面板中的8類屬性。字體（font-family）、大小（font-size）、.粗細（font-weight）、樣式（font-style）、.變量、行高（line-height）、大小寫（text-transform）、顏色（color）、修飾（text-decoration）在“插入”工具欄單擊“布局”按鈕，進入布局模式。8表單的運用。1.輸入文本水平線表單插入表格3.插入文本框復選框提交框，按鈕最后的表單就是下面圖于是一個個人簡單的網頁就制作完成了。參考文獻：Dreamweaver/visualstduio的相關運用操作手冊及實驗教材。指導教師對實驗設計方案的意見對老師的教學方法和指導方式相當滿意。