信息發(fā)布與網(wǎng)頁(yè)設(shè)計(jì)-Dreamweaver9 層_第1頁(yè)
信息發(fā)布與網(wǎng)頁(yè)設(shè)計(jì)-Dreamweaver9 層_第2頁(yè)
信息發(fā)布與網(wǎng)頁(yè)設(shè)計(jì)-Dreamweaver9 層_第3頁(yè)
信息發(fā)布與網(wǎng)頁(yè)設(shè)計(jì)-Dreamweaver9 層_第4頁(yè)
信息發(fā)布與網(wǎng)頁(yè)設(shè)計(jì)-Dreamweaver9 層_第5頁(yè)
已閱讀5頁(yè)，還剩27頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

信息發(fā)布與網(wǎng)頁(yè)設(shè)計(jì)DREAMWEAVER第9章層信息學(xué)院?信息發(fā)布與網(wǎng)頁(yè)設(shè)計(jì)?課題組24三月2024返回3.9層的使用3.9.1層的分類CSS層DIVSPANNetscape層LAYERILAYER3.9.2創(chuàng)立層3.9.2.1創(chuàng)立普通層方法1:“插入〞→“布局對(duì)象〞→“層〞方法2:“布局〞子面板→“描繪層〞按鈕，按下鼠標(biāo)左鍵繪制層。3.9.2.2創(chuàng)立嵌套層在層內(nèi)部點(diǎn)擊，然后插入的層即為其子層，子層可繼承父層的特性如：顯示/隱藏等。子層的物理位置不一定在父層中。3.9.3設(shè)置層的參數(shù)設(shè)置層的默認(rèn)參數(shù)菜單“編輯〞→“首選參數(shù)〞→選擇分類中的“層〞設(shè)置具體參數(shù)顯示： 默認(rèn)|繼承|可見|隱藏寬/高： 分別設(shè)置層的寬和高背景： 顏色|圖像 3.9.4設(shè)置層的屬性選擇一個(gè)層三種方法：“窗口〞→“層〞→“層面板〞→選擇“層〞的名稱單擊層的選擇柄〔層左上角回形框〕，單擊層的邊框選擇多個(gè)層按下Shift鍵，單擊層面板中的層名稱按下Shift鍵，單擊層邊框或?qū)又腥我馕恢?.9.4設(shè)置層的屬性層屬性面板層的浮動(dòng)面板3.9.5層的根本操作3.9.5.1在層中添加內(nèi)容添加文字添加圖像區(qū)別層的大小與插入層中的圖像的大小,不一致時(shí)會(huì)有溢出、填充等。層與插入層中的圖像的大小可分別設(shè)置3.9.5.2更改層的大小選擇層,利用控制點(diǎn)調(diào)整大小選擇層,利用屬性面板設(shè)置寬、高。3.9.5.3移動(dòng)層選擇層，通過拖動(dòng)，移動(dòng)層。選擇層，通過層屬性面板精確定位。在拖動(dòng)層的高級(jí)選項(xiàng)中，調(diào)用JavaSvrpt:的文本框中輸入：JavaSvrpt:alert(‘ok’)，可彈出信息。3.9.5.4對(duì)齊層選擇多個(gè)層，可以：左對(duì)齊、右對(duì)齊、頂部對(duì)齊、底部對(duì)齊。3.9.5.5顯示和隱藏層使用屬性面板的“可見性〞在層標(biāo)志上點(diǎn)擊右鍵，選擇“可見性〞使用層浮動(dòng)面板中的“眼睛〞按鈕，眼睛睜開為可見，眼睛閉合為不可見。3.9.5.6更改層的名稱隱含的層名稱為：Layer1、Layer2…。更改層名稱〔與內(nèi)容相關(guān)〕方法一 雙擊層浮動(dòng)面板上的層名稱，更新方法二 在層的屬性面板“層編號(hào)〞文本框中，輸入新的名稱。3.9.5.7改變層的堆棧Z-index確定層的垂直位置，即在瀏覽器中顯示的順序，數(shù)值大的在后，小的在前。隱藏前面的才可見后面的。改變層堆棧方法一 在層的浮動(dòng)面板中更改Z列的數(shù)值方法二在層的屬性面板中，更改Z-index的數(shù)值3.9.6表格與層的轉(zhuǎn)換3.9.6.1層轉(zhuǎn)換為表格 “修改〞→“轉(zhuǎn)換〞→“層到表格〞3.9.6.2表格轉(zhuǎn)換為層“修改〞→“轉(zhuǎn)換〞→“表格到層〞層的應(yīng)用練習(xí)一利用層制作下拉菜單4/25/202416層練習(xí)-下拉菜單-1風(fēng)景圖片名勝古跡東岳泰山蛾眉金頂九華山故宮十三陵頤和園南岳衡山長(zhǎng)城西岳華山天壇下拉菜單的制作1插入Layer1層，其中插入1行2列、邊框?yàn)?、寬度為200的表格,制作主菜單。在兩個(gè)單元格中分別輸入“名勝古跡〞、“自然風(fēng)景〞作為菜單項(xiàng)。插入Layer2層，其中插入1個(gè)5行1列的表格，5行單元格中分別輸入：東岳泰山、蛾眉金頂、九華山、南岳衡山、西岳華山；設(shè)置居中顯示。在主菜單的上一行位置，插入1個(gè)段落<p></p>，其中插入3個(gè)強(qiáng)制換行標(biāo)記<br>，給段落標(biāo)志添加1個(gè)行為：onmouseover，隱藏Layer2子菜單；4/25/202418在文檔中連續(xù)插入5個(gè)層，分別命名為s1-s5，在5個(gè)層中各插入相應(yīng)的一幅圖像；調(diào)整層的大小200寬、300高、頂點(diǎn)位置相同；如左：300；上50；設(shè)置層的屬性為“隱藏〞或分別選擇5個(gè)層，調(diào)整成一樣的大小。選擇5個(gè)層，執(zhí)行菜單【修改】、【對(duì)齊】中的“設(shè)置成寬度相同〞；和“設(shè)置成高度相同〞命令。對(duì)齊層4/25/202419選擇“名勝古跡〞，添加空連接“#〞；點(diǎn)擊行為的+號(hào)；選擇“顯示/隱藏層〞；設(shè)置onMouseOver事件，Layer2層為“顯示〞；再次單擊“＋〞按鈕，設(shè)置“顯示/隱藏層〞，Layer2為“隱藏〞，并修改事件為onMouseOut。保存并測(cè)試，同法設(shè)置其它圖層。為文字“〞添加行為提示瀏覽者點(diǎn)擊4/25/202420層的應(yīng)用練習(xí)二拼圖游戲的制作4/25/202421準(zhǔn)備工作：選擇一幅作為拼圖的適宜圖片；計(jì)算圖的尺寸、切分塊數(shù)及切分后每個(gè)圖的尺寸；如設(shè)定：2行X3列，6塊圖；大圖尺寸：300X100；每個(gè)小圖的尺寸為100X50；確定每個(gè)圖右上角的位置〔距離左邊和上邊的距離〕。使用拖動(dòng)層創(chuàng)立“拼圖游戲〞4/25/202422在Fireworks中翻開圖片，在工具箱中選擇“切片工具〞中的“矩形〞切片工具；在圖片左上焦，按下鼠標(biāo)左鍵，在切片區(qū)域的終點(diǎn)，松開鼠標(biāo)左鍵；切割1塊圖片；重復(fù)步驟2，將圖片分割成大小相等的N塊；將圖象碎片導(dǎo)出，方法：文件導(dǎo)出，對(duì)話框進(jìn)行如下設(shè)置：使用FireworksMX制作拼圖塊14/25/202423指定導(dǎo)出的HTML文件名為：拼圖游戲保存類型為：htmlandimages在Html下拉菜單中選擇：ExportHTMLFiles在Slices下拉菜單中選擇：ExportSlices點(diǎn)擊保存按紐，將1個(gè)HTML文件和分割的N個(gè)圖片保存在指定的文件夾中。使用FireworksMX制作拼圖塊24/25/202424回到Dreamweaver中,按如下方法導(dǎo)入HTML文件新建一個(gè)網(wǎng)頁(yè)文件，名為：pingtu.htm。將文檔標(biāo)題改為“拼圖游戲〞，輸入文本“請(qǐng)將下面N幅圖片拼成一個(gè)完整的圖案〞，保存；插入拼圖游戲切片 插入圖象對(duì)象FireworksHTML。載入步驟2導(dǎo)出的用表格表示的圖象。將表格轉(zhuǎn)換為層 修改變換表格到層，將表格中的圖片轉(zhuǎn)換到層中。使用FireworksMX制作拼圖塊34/25/202425分別調(diào)整層的大小為:200X100；分別調(diào)整層中圖片的大小為200X100；

使用FireworksMX制作拼圖塊44/25/202426設(shè)置層的位置層1層2層3層4層5層6使用FireworksMX制作拼圖塊54/25/202427建立一個(gè)新的層〔寬600，高100〕，層的起點(diǎn)位置在〔500，500〕，層中插入一個(gè)2行3列、邊框?yàn)?的表格(每個(gè)單元格寬200高100)，作為拼圖的目的位置。設(shè)置拖動(dòng)層的目的位置4/25/202428選擇狀態(tài)欄中的<body>標(biāo)記，有菜單欄上的“窗口〞中，翻開行為面板，點(diǎn)擊〔+〕按紐，在行為列表中選擇“拖動(dòng)層〞〔DragLayer〕；在對(duì)話框中設(shè)置： 拖動(dòng)的層名稱； 設(shè)置拖動(dòng)層的目的位置； 設(shè)定吸附距離； 點(diǎn)擊確定退出，隱含設(shè)定事件為Onloadalert(‘您好！歡送訪問我的主頁(yè)。’)1重復(fù)步驟16，設(shè)置其它層的拖動(dòng)設(shè)置拖動(dòng)層的行為14/25/202429高級(jí)選項(xiàng)中設(shè)置彈出信息

alert(‘繼續(xù)努力！’)1設(shè)置拖動(dòng)層的行為24/25/202430設(shè)置狀態(tài)欄文本行為選擇<body>，創(chuàng)立行為；“設(shè)置文本〞“設(shè)置狀態(tài)欄文本〞輸入【消息】?jī)?nèi)容；設(shè)置觸發(fā)事件為：OnLoad預(yù)覽。設(shè)置翻開網(wǎng)頁(yè)時(shí)的歡送信息4

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

最新文檔

評(píng)論

0/150

提交評(píng)論