Dreamweaver 進階網頁製作 B88901043 許天彰.

Presentation on theme: "Dreamweaver 進階網頁製作 B88901043 許天彰."— Presentation transcript:

1 Dreamweaver 進階網頁製作 B 許天彰

2 大綱 階層樣式表 CSS(Cascading Style Sheet) 網頁的行為指令Behavior 在網頁上嵌入多媒體物件
組織整個網站->site

3 階層樣式表 CSS(Cascading Style Sheet)
簡介->讓網頁設計者在編排與空間配置更有彈性 範例 <style type="text/css"> <!-- .word1 { font-family: "Arial", "Helvetica", "sans-serif"; font-size: 12px; color: #000000} .word2 { font-family: "Courier New", "Courier", "mono"; font-size: 24px; font-weight: bold; color: #FF6600; text-decoration: underline} a:hover { font-family: "Arial", "Helvetica", "sans-serif"; font-size: 14px; font-weight: 100; color: #000000} --> </style>

4 CSS連結模式

5 插入CSS連結

6 階層樣式表 CSS cont 製作自訂樣式 Make Custom Style 重新定義HTML標籤 Redefine HTML Tag
使用CSS判斷規則 Use CSS Selector

7 各種樣式 字型 Type 背景 Background 區塊 Block 邊緣 Border 列表 List 位置 Positioning
擴充 Extensions

8 各種樣式

9 Use CSS Selector

10 CSS的套用

11 CSS的套用 2

12 CSS的套用 – 完成

13 網頁的行為指令Behavior Behavior的概念: Event->Actions

14 Behavior 2 常用behavior:檢查瀏覽器版本 開啟瀏覽視窗 彈出訊息方塊
TimeLine ->配合圖層(Layer)和Behavior產生動態的網頁

15 TimeLine實作: 建立圖層 加入到Timeline 用behavior來啟動Timeline

16 Time Line

17 Time Line 2

18 嵌入多媒體物件 Flash按鈕 Flash文字 Shockwave與Fireworks

19 範例展示 網頁:酋長島

20 組織整個網站->site 本地檔案資料 遠端server資料 網頁傳輸 同步化

21 報告結束 感謝助教借閱Dreamweaver參考書籍 感謝酋長提供靈感。