使用圖像和多媒體創(chuàng)建豐富多彩的網頁課件

1、第2章使用圖像和多媒體創(chuàng)建豐富多彩的網頁教學內容：美化網頁最簡單、最直接的方法就是在網頁上添加圖像，圖像不但使網頁更加美觀、形象和生動，而且使網頁中的內容更加豐富多彩。除此之外還有各種各樣的其他元素，如動畫、聲音等。圖像或多媒體是文本的解釋和說明，在文檔的適當位置上放置一些圖像或多媒體，不僅可以使文本更加容易閱讀，而且使得文檔更加具有吸引力。本章主要講述圖像的基本使用、如何添加Flash影片和插入其他媒體對象等。學習目標掌握在網頁文檔中插入圖像掌握在網頁中插入Flash影片掌握給網頁添加背景音樂掌握網頁中其他媒體的插入教學目標和基本要求_教學時間：本章共分_課時教學方法案例教學多媒體教學理論面

2、授教學素材課程范例文件：sample第2章練習文件：exercise第2章2.1 網頁中圖像常用的常識網頁中圖像的格式通常有3種，即GIF、JPEG和PNG。目前對GIF和JPEG 文件格式的支持情況最好，大多數瀏覽器都可以查看它們。由于PNG文件具有較大的靈活性并且文件較小，所以它對于幾乎任何類型的網頁圖形都是最適合的。但是Microsoft Internet Explorer和Netscape Navigator只能部分支持PNG圖像的顯示。建議使用GIF或JPEG格式以滿足更多人的需求 。2.2.1小案例插入圖像圖像是網頁中最主要的元素之一，一幅幅圖像和一個個漂亮的按鈕不但使網頁更加美觀

3、、形象和生動，而且與文本相比能夠更直觀地說明問題，使表達的意思一目了然，這樣圖像就會為網站增添生命力，同時也加深用戶對網站良好的印象 。2.2.2 設置圖像屬性在文檔中插入圖像后，Dreamweaver CS6會自動按照圖像的大小顯示，所以還需要對圖像的屬性進行具體的調整，如大小、位置和對齊等。選中圖像，在圖像的【屬性】面板中可以自定義圖像的屬性 。2.2.4 調整圖像亮度和對比度圖像編輯功能可以不用離開Dreamweaver就能夠完成，編輯工具是內嵌的Fireworks技術。這樣在編輯網頁圖像時就輕松多了，不需要一定打開其他的圖像處理工具進行處理，從而大大提高了工作效率。在Dreamweav

4、er CS6中還可以直接調整圖像的亮度/對比度。這將影響圖像的高亮顯示、陰影和中間色調。修正過暗或過亮的圖像時通常使用亮度/對比度。2.2.5 銳化圖像銳化將增加對象邊緣像素的對比度，從而增加圖像的清晰度或銳度。2.3 插入其他網頁圖像Dreamweaver CS6提供了多種精彩的網頁圖像設計，如插入圖像占位符、插入鼠標經過圖像等，下面分別進行講述 。2.3.1小案例插入圖像占位符有時候根據頁面布局的需要，要在網頁中插入一幅圖片。這個時候可以不制作圖片，而是使用占位符來代替圖片位置。2.3.2小案例插入鼠標經過圖像鼠標經過圖像就是當鼠標經過圖像時，原圖像會變成另外一張圖像。鼠標經過圖像其實是由

5、兩張圖像組成的：原始圖像和鼠標經過圖像。組成鼠標經過圖像的兩張圖像必須有相同的大?。蝗绻麅蓮垐D像的大小不同，Dreamweaver會自動將第二張圖像大小調整成第一張同樣大小。鼠標經過圖像前的效果如左圖所示，鼠標經過圖像時的效果如圖右所示。2.4小案例添加Flash影片SWF動畫是在專門的Flash軟件中完成的，在Dreamweaver中能將現有的SWF動畫插入到文檔中。2.6 插入其他媒體對象使用Dreamweaver可以在一個網頁中插入多種媒體對象，Dreamweaver可以有效地將多媒體元素與網頁中的其他元素有機地整合在一起，豐富網頁的內容，為網頁增添魅力 。2.6.1小案例插入Apple

6、t Java是一種允許開發(fā)并可以嵌入Web頁面的編程語言。Java Applet是在Java的基礎上演變而成的應用程序，它可以嵌入到網頁中用來指定一定的任務。Java Applet小程序創(chuàng)建以后，Dreamweaver CS6將它插入到HTML文檔中，并使用Applet標簽來標識對小程序文件的引用 。2.7 綜合案例可以使用Dreamweaver中的可視化工具向頁面添加各種內容，包括文本、圖像、影片、聲音和其他媒體形式等。在前面的章節(jié)中學習了圖像和多媒體內容的添加，本節(jié)將通過實例來講述其具體的應用 。綜合案例1創(chuàng)建圖文混排網頁文字和圖像是網頁中最基本的元素，在網頁中合理地插入圖像能使得網頁更加生動、形象。圖像和文本混和排列的網頁是常見的網頁 。綜合案例2制作精彩的多媒體網頁常見的多媒體網頁一般還有動畫或聲音。本節(jié)主要介紹使用插件插入聲音效果。本 章 小 結通過這章的學習，讀者應該掌握了各種圖像和多媒體的使用，包括基本圖像、圖像占位符、鼠標經過圖像、Flash動畫、視頻影片、背景音樂等。在這里再強調一下圖像和多媒體的重要性，