多媒体制作(MultimediaProduction).doc

XB2網頁編寫工具 建立簡單網頁 連結(links) 習作1 使用DW製作以下超連結至林百欣網頁，並寫下原始檔。 林百欣中學網頁 HTML原始檔 錨點(anchors) 習作2 使用DW製作網頁，網頁中有兩則新聞，在兩則新聞的開始設定命名錨點（a1,a2），然後在網頁的開首加入兩連結文字：新聞一及新聞二，分別連至a1及a2，寫下命名錨點及超連結的原始檔。 新聞一 新聞二 ： ［新聞一］ ［新聞二］ HTML原始檔 列表(lists) 習作3 使用DW製作以下列表，並寫下原始檔。 硬件 輸入設備 CPU 輸出設備 軟件 OS OFFICE 註 CPU Central Processing Unit OS Operating System HTML原始檔 表單(tables) 習作4 使用DW製作以下表單並寫下原始檔。 HTML原始檔 框(frame) 習作5 使用DW製作以下框架並寫下原始檔。 標題是FrameSet 分左右兩個框 左框佔20%，名稱是index，右框佔80%，名稱是content。 左框的第一頁是toc.htm，右框的第一頁是main.htm。 HTML原始檔 使用DW製作以toc.htm並寫下原始檔。 按文字連結lpy，右框會顯視 .hk 按文字連結Yahoo，右框會顯視 .hk 按文字連結回到主頁，右框會顯視 main.htm HTML原始檔 郵寄到(mailto) 習作6 使用DW製作以下郵寄到的連結並寫下原始檔。 電郵：lawsir@ HTML原始檔 加入多媒體元素 (embed multimedia elements) 習作7 使用DW製作以下網頁並寫下原始檔。 嵌入1相片、1動態GIF、 1聲音檔(背景音樂)、 1視像(要按開啟才播放)及 1 Flash動畫(自動播放) HTML原始檔 為同一組網頁維持統一的設計及風格 層疊樣式表(CSS 的全名為 Cascading Style Sheets)，是一種樣式表語言。它的目的是為 XHTML 及 HTML 等網頁語言加入設計。採用 CSS 的話，我們就可以將資料及設計分開：HTML 文件只包括資料，而 CSS 則告訴瀏覽器這些資料應該要如何顯現出來。 一個式樣表由一組規則組成。每個規則由一個「選擇器」（selector）和一個定義部分組成。每個定義部分包含一組由分號（;）分離的定義。這組定義放在一對大括弧{ }之間。每個定義由一個屬性，一個冒號（:）和一個值組成。 1) 選擇器（Selector） 通常為檔中的元素（element），如HTML中的body，p，strong等標籤，多個選擇器可以逗號（,）隔開。 2) 屬性（property） CSS規定了許多的屬性，目的在控制選擇器的樣式。 3) 值（value） 指屬性接受的設定值，可由各種關鍵字（keyword）組成，多個關鍵字時大都以空格隔開。 例子： p{ font-size: 150%; font-family: Times New Roman, Courier; } h2{ color: red; background: blue; } .highlight{ color: red; background: yellow; font-weight: bold; } 在這個例子中有三個選擇器：p、h2和.highlight，color: red是一個定義，其中color是屬性，red是color的值。 在這裏HTML中的結構P（段落）和H2（2級標題）獲得了不同的樣式。每個段落的字體的大小比包含這個段落的結構的字體的大小要大50%，其 字形是Times New Roman，假如Times New Roman沒有的話那麼使用Courier字形。2級標題的字用紅色，底面是藍色的。這個例子中的第三個規則規定了一個class的樣式。通過class屬性每個HTML結構都可以被指定為這個class，例如：P class=highlight這個段落將被顯示為黃底紅字粗體。 例１： 例2:樣式表也可以另外存在一個樣式表檔案中，例如把下列樣式檔稱為css1.css HTML檔的head部份附加樣式表便可以： LINK href=css1.css type=text/css rel=stylesheet 習作8：使用記事本製作以上例一（style1.htm）(style2.htm, css1.css) 使用DW設定CSS 視窗- CSS 樣式 套用CSS 套用本頁CSS，格式-CSS樣式 套用外在的CSS檔，i) 格式-附加樣式表 ii) 格式-CSS樣式 習作9：使用DW製作以下嵌入樣式及內容，檔名為style3.htm 樣式 內容 font