猫咪拼图.docVIP

網站拼圖製作 作品主題【貓咪拼圖】 1 彈出訊息視窗 2 設定自動重新整理網頁 3 Ap-div應用 4 鎖定視窗大小 5 設定【重新開始遊戲】與【關閉遊戲】。 *重點回顧 *學習評量 AP Div (絕對定位) Dreamweaver的絕對定位，稱為AP Div，簡稱AP元素。 AP元素為空心的方框，在裡面可以插入文字、影像並且可以插入任何在HTML文件內容中的物件。 每一個AP元素都有唯一的ID。 如果要修改AP元素的ID，只能用標準的英、數字元，不能使用特殊字元。 在網頁中，編號較高的AP元素會出現在編號較低的AP元素前面。 例如:AP Div1、AP Div2來說， AP Div2的圖片會在AP Div1前面。 Z軸代表堆疊順序(上下重疊順序)。 使用「AP元素」面板來變更AP元素的堆疊順序，要比輸入特定的 z 軸值來得容易。 顯示 1.Default(預設)：不指定顯示屬性。 2.Inherit(繼承)：使用AP元素上一層顯示的屬性，沒有指定 顯示時，大多瀏覽器預設為『繼承』。 3.Visible(顯示)：顯示AP元素，不管上一層的值為何。 4.hidden (隱藏)：隱藏AP元素，不管上一層的值為何。 溢位：會控制當內容超出AP元素指定大小時， AP元素在瀏覽器中的顯示方式。 1.Visible(顯示)：指額外的內容要出現在AP元素中。實際上，AP元素 會延伸以容納內容。 2.Inherit(隱藏)：指定另外的內容不要顯示在瀏覽器中。 3.Scroll(捲動)：會使瀏覽器針對AP元素而增加捲軸，不論是否需要。 4.Auto(自動)：會使瀏覽器只在需要時(也就是，AP元素內容超過界限時)， 才顯示AP元素的捲軸。 參考資料：/zh_TW/Dreamweaver/9.0/index.html 1.彈出訊息視窗 開啟【Default.html】編輯，並且設定【背景影像】。 step1：開啟Adobe Dreamweaver CS4，點選【檔案】面板 →【開啟舊檔】→ 選擇【拼圖】資料夾 → 雙擊『Default.html』or 選擇『Default.html』按【開啟】。 step2：點選【屬性】面板中【頁面屬性】→ 選擇【外觀（html）】→【背景影像】點選瀏覽 → 雙擊【images】資料夾 → 選擇【11.jpg】圖片並按【確定】 → 在【頁面屬性】面板中按【確定】。 設定【網頁載入時】，將會【彈出訊息視窗】。 step1： 點選頁面狀態列的＜body＞標籤『提示圖1』，在【標籤檢視窗】面板中，點選【行為】『提示圖2』，按【＋】鈕『提示圖3』，選擇【彈出訊息】 → 【訊息內容】：『按確定後，遊戲就會開始，限時20秒，超過20秒會自動重新開始！！』『提示圖4』 附註：假如沒有【標籤檢視窗】面板，在【視窗】面板 → 選擇【標籤檢測器】或者按【F9】。 step2：檢查【行為】面板，【彈出訊息】的『行為事件』是否為【OnLoad】，否的話，請按『提示圖5』的地方，將會出現下拉式選單『提示圖6』，請選擇【OnLoad】行為事件。 2.設定自動重新整理網頁。 step1：點選【插入】版面 → 【Html】 → 【檔頭標籤】，點選【重新整理】。 step2：設定【延遲20秒】、點選【重新整理這個文件】，按確定。 3.AP Div應用 step1：點選【插入】版面 → 【版面物件】 → 【AP Div】，點選【AP Div】方框，並在【屬性】面板設定數值，如下表格。(AP元素總共11個) AP元素 左 上 寬 高 AP Div1 0 px 0 px 140px 187 px AP Div2 0 px 250 px 140 px 187 px AP Div3 0 px 500 px 140 px 187 px AP Div4 160 px 563 px 140 px 187 px AP Div5 330 px 563 px 140 px 187 px AP Div6 500 px 563 px 140 px 187 px AP Div7 660 px 0 px 140 px 187 px AP Div8 660 px 250 px 140 px 187 px AP Div9 660 px 500 px 140 px 187 px AP Div10 880 px 50 px 100 px 150 px AP Div11 880 px 250 px 100 px 150 px