1、 第第6 6課課 網(wǎng)頁制作小能手網(wǎng)頁制作小能手小明完成了對班級網(wǎng)站首頁布局類型和板塊內(nèi)容的設(shè)計，并且使用Dreamweaver CS6 的表格工具對其進行了規(guī)劃。本課，我們將學習如何設(shè)計網(wǎng)頁中的基本元素，進一步完善班級網(wǎng)站。 學習任務學習任務1. 設(shè)置網(wǎng)頁、單元格背景。2. 為網(wǎng)頁插入圖片、音視頻和添加動態(tài)效果。3. 為網(wǎng)頁設(shè)置超級鏈接。 一、設(shè)置網(wǎng)頁、單元格背景一、設(shè)置網(wǎng)頁、單元格背景方法一：執(zhí)行“修改”“頁面屬性”命令，在彈出的“頁面屬性”對話框中，選擇“外觀”項，單擊“背景圖像”后的“瀏覽”按鈕，在“選擇圖像源文件”對話框中，找到合適的圖片。單擊“確定”按鈕回到“頁面屬性”對話框，依次單

2、擊“應用”和“確定”按鈕即可完成網(wǎng)頁背景設(shè)置的操作。任務一：設(shè)置網(wǎng)頁背景任務一：設(shè)置網(wǎng)頁背景 一、設(shè)置網(wǎng)頁、單元格背景一、設(shè)置網(wǎng)頁、單元格背景方法二：如果我們想讓網(wǎng)頁背景更加炫酷，還可以使用CSS3來實現(xiàn)，比如將兩張圖片重疊為背景。我們只需要將兩張名為bg_1.gif和bg_2.gif的背景透明圖片放到animations文件夾，然后切換到“代碼”視圖，找到-代碼，在它們之間插入下列代碼就可以了。BodyBackground-image:url(animations/bg_1.gif),url(animations/bg_2.gif);任務一：設(shè)置網(wǎng)頁背景任務一：設(shè)置網(wǎng)頁背景 一、設(shè)置網(wǎng)頁、單

3、元格背景一、設(shè)置網(wǎng)頁、單元格背景選中某個單元格，將視圖切換為“拆分”視圖，在左邊的代碼中找到光標所在的行，把光標移到前面的內(nèi)，再按鍵盤的空格鍵，在彈出的提示中選齊background” “瀏覽”，在彈出的“選擇文件”對話框中選擇合適的圖片，單擊“確定”按鈕。任務二：設(shè)置單元格背景任務二：設(shè)置單元格背景在單元格中插入背景圖像 二、插入圖片、音視頻和添加動態(tài)效果二、插入圖片、音視頻和添加動態(tài)效果任務一：插入圖片任務一：插入圖片選中“圖片區(qū)”單元格，執(zhí)行“插入”“圖像”命令，在彈出的“選擇圖像源文件”對話框中找到圖片，單擊“確定”按鈕，將圖片插入網(wǎng)頁中。插入圖片 二、插入圖片、音視頻和添加動態(tài)效果二

4、、插入圖片、音視頻和添加動態(tài)效果任務二：插入音頻和視頻任務二：插入音頻和視頻執(zhí)行“插入”“媒體”“插件”命令，在彈出的“選擇文件”對話框中，選擇音頻或視頻文件，將其插入到網(wǎng)頁中相應的位置。插入音頻和視頻 二、插入圖片、音視頻和添加動態(tài)效果二、插入圖片、音視頻和添加動態(tài)效果任務三：添加動態(tài)效果任務三：添加動態(tài)效果我們還可以在網(wǎng)頁中添加一些特殊的動態(tài)效果，選中圖片和文字，然后點擊左上角的“拆分”按鈕，將文檔窗口切換為“拆分”視圖，將代碼窗口的藍色區(qū)域兩端分別添加運動文本標簽和。添加動態(tài)效果 三、為網(wǎng)頁設(shè)置超級鏈接三、為網(wǎng)頁設(shè)置超級鏈接1. 確定鏈接的對象和內(nèi)容在“屬性”面板中設(shè)置鏈接2. 選擇合適的超級鏈接類型3. 將首頁和各個子網(wǎng)網(wǎng)頁鏈接起來 總結(jié)總結(jié)1. 網(wǎng)頁背景的設(shè)置可以通過“頁面屬性”來完成也可以通過CSS3 代碼實現(xiàn)；2. 在網(wǎng)頁設(shè)計過程中，添加動