2022-06-28 分類(lèi): 網(wǎng)站建設(shè)
有些網(wǎng)頁(yè)開(kāi)發(fā)者稱(chēng)以下要介紹的這種技巧為 liquid,我在這兒則把這種技巧叫做是 stretchy(彈性延伸的技巧)。這是一種技巧,可在訪客瀏覽器窗口大小改變時(shí)也隨之調(diào)整網(wǎng)頁(yè)頁(yè)面大小,因此若是窗口過(guò)大就不會(huì)有空白處、窗口過(guò)小邊緣就不會(huì)跑出上下移動(dòng)的拉Bar。其實(shí)大多數(shù)簡(jiǎn)單的網(wǎng)頁(yè)會(huì)自己隨著瀏覽器窗口大小來(lái)調(diào)整頁(yè)面大小,但是若是網(wǎng)頁(yè)里用到很多不同的框框及表格,網(wǎng)頁(yè)頁(yè)面大小就很難自動(dòng)彈性地調(diào)整。通常網(wǎng)頁(yè)設(shè)計(jì)者會(huì)用混合運(yùn)用固定欄寬的框框,和 GIF 圖檔作為間隔, 來(lái)設(shè)計(jì)網(wǎng)頁(yè)頁(yè)面,這樣一來(lái)不論是用 Internet Explorer 或是用,頁(yè)面大小都會(huì)固定而不會(huì)跑掉。用 Dreamweaver 4.0 可以輕而易舉的設(shè)計(jì)出會(huì)自動(dòng)彈性調(diào)整的網(wǎng)頁(yè)。要怎么做呢?
2. 讓按鈕有閃動(dòng)效果
在 Dreamweaver中,不用有 Flash 程序,也可以制作有閃動(dòng)效果的 Flash 按鈕對(duì)象。 4.0 版內(nèi)建有好幾個(gè) Flash 按鈕對(duì)象,可以制作好幾個(gè)不同形式的按鈕。選擇 Insert ·Interactive Images ·Flash Button 就可看到有哪些內(nèi)建按鈕。在對(duì)話框內(nèi)甚至可以用鼠標(biāo)指到想要使用的按鈕形式,然后看看在瀏覽器里的效果如何。用鼠標(biāo)光標(biāo)把要用的按鈕形式選起來(lái),再依序輸入?yún)?shù),例如按鈕上的文字、字形、顏色、連結(jié)等,或是自定文件名稱(chēng)。按 下OK。接下來(lái)就會(huì)有一個(gè) SWF 檔產(chǎn)生,檔案并會(huì)自動(dòng)置入你的網(wǎng)頁(yè)中。按一下這個(gè)做好的檔案,會(huì)看到 Property Inspector (屬性明細(xì))中會(huì)秀出檔案的屬性。將檔案屬性秀出來(lái)時(shí),如果擴(kuò)展檔案屬性明細(xì)表,會(huì)出現(xiàn) Play (播放)鈕,選擇之后可以不用開(kāi)啟瀏覽器來(lái)預(yù)視按鈕的閃動(dòng)效果。
3. 制作流動(dòng)文字
在網(wǎng)頁(yè)中增加 流動(dòng)文字就像增加我剛剛介紹的 Flash 按鈕一樣簡(jiǎn)單。相同地,不用安裝 Flash,用 Dreamweaver 4.0 提供的新功能就可以輕松辦到。常用 HTML 語(yǔ)法寫(xiě)網(wǎng)頁(yè)、沒(méi)有交互式媒體經(jīng)驗(yàn)的網(wǎng)頁(yè)制作者也可以輕松制作出小巧的 Flash 形式的流動(dòng)文字。根據(jù) Macromedia 表示,有97%的網(wǎng)絡(luò)使用者可以觀看有 Flash 效果的網(wǎng)頁(yè),因此這項(xiàng)新功能可以在不添加兼容性麻煩的情況下為網(wǎng)頁(yè)增添一些瀏覽上與讀者的互動(dòng)性。選擇Insert ·Interactive Images ·Flash Text,再將偏好設(shè)定一一填入
4. 創(chuàng)造個(gè)性化調(diào)色盤(pán)
Dreamweaver 4.0 新的 Assets panel(屬性控制面板)是一種可以在編輯網(wǎng)站時(shí)根據(jù)檔案型態(tài),例如圖片、樣板等來(lái)管理檔案的新工具,當(dāng)你定義新站臺(tái)時(shí)(選擇Site · New Site),所有類(lèi)型的組件會(huì)自動(dòng)增加到 Asset panel 里的適當(dāng)表框中。這個(gè)加入新的Assets panel屬性控制面版里也有顏色框,儲(chǔ)存你網(wǎng)站里所用到的所有色彩,包含文字的顏色、背景的顏色,以及連結(jié)的顏色等。這是一個(gè)為使用者量身定做的網(wǎng)站導(dǎo)向顏色盤(pán)。只要激活 Assets panel (先選擇 Window · 再選擇 Assets),接著選擇左方那個(gè)小小的色彩滾動(dòng)條,就可以看到你網(wǎng)站里各式各樣的顏色選項(xiàng)。當(dāng)然你可以將這些顏色拉到某些特定選取的文字中。甚至當(dāng)你選擇某種顏色時(shí),畫(huà)面上會(huì)出現(xiàn)這種顏色的十六進(jìn)制值的色彩濃淡度,和三色對(duì)應(yīng)碼(RGB)。如果想將調(diào)色盤(pán)工具列縮小一點(diǎn),甚至可以?xún)H加入某些顏色到調(diào)色盤(pán)的收藏夾里。只需將選取的顏色反白、選擇窗口里一個(gè)叫做「添加到我的收藏夾」按鈕(最下方靠右的按鈕),就完成了。
5. 制作彈出式選單導(dǎo)覽系統(tǒng)
原本要制作彈出式選單導(dǎo)覽系統(tǒng)(Pop-up Menu Navigation System)要用到好一些 JavaScript 的語(yǔ)法技巧,但是若你裝了Dreamweaver/Fireworks Studio,輕輕松松即可快速辦到。首先在 Fireworks 里開(kāi)始,選擇某個(gè)圖片, 然后在 Set Pop-Up Menu的對(duì)話框里選擇 Insert· Pop-Up Menu,你可以輸入項(xiàng)目(items)的名稱(chēng)并選擇 Plus (加入)按鈕,來(lái)新增該項(xiàng)目。你可以繼續(xù)在跳出來(lái)的訊息框里進(jìn)行細(xì)項(xiàng)設(shè)定,例如設(shè)定該項(xiàng)目所要用的文字及連結(jié),當(dāng)然也可以新增子選單、并重新安排下一層的設(shè)定。完成時(shí),選擇 Next (下一步),繼續(xù)設(shè)定偏好值,例如顏色、字體等等。這時(shí)選單完成后,可以預(yù)覽 HTML 語(yǔ)法,也可預(yù)覽影像。再選擇 Finish (完成)。這時(shí)當(dāng)鼠標(biāo)移動(dòng)到原來(lái)的圖案時(shí),會(huì)出現(xiàn)選單系統(tǒng)的內(nèi)容一覽。 接著將制作好的檔案匯出時(shí), Fireworks 會(huì)自動(dòng)生產(chǎn)出所有 Dreamweaver 需要用到的 HTML、JavaScript,以及影像檔案。
6. 讓圖檔動(dòng)起來(lái)!
如果你同時(shí)安裝有 Dreamweaver/Fireworks Studio,這兩種產(chǎn)品搭配的好程度將使你贊不絕口。即使你不是專(zhuān)業(yè)的圖檔設(shè)計(jì)者,在設(shè)計(jì)網(wǎng)頁(yè)時(shí)也多多少少想把一些 GIF 圖片文件修改得活靈活現(xiàn)。Dreamweaver 可以讓你制作動(dòng)畫(huà)不求人喔!在標(biāo)準(zhǔn)窗口里選擇要進(jìn)行修改的圖片,然后在 Property Inspector 里選擇編輯鈕(Edit)。如果你安裝的 Dreamweaver里附有 Fireworks, Fireworks 就是 Dreamweaver 預(yù)設(shè)圖片編輯器,這時(shí)圖片就會(huì)自動(dòng)加載到 Fireworks。(若仔細(xì)看,各位會(huì)發(fā)現(xiàn) Fireworks 的畫(huà)面會(huì)出現(xiàn) Editing From Dreamweaver 這樣的文字和圖樣,指示你可以由Dreamweaver 里進(jìn)行圖片編輯。) 好了,現(xiàn)在在 Fireworks 里選擇要編輯的圖片,選擇 Modify ·Animate ·Animate Selection。 接下來(lái)完成 Animate dialog box 里的設(shè)定,選定動(dòng)畫(huà)的框架數(shù),動(dòng)畫(huà)移動(dòng)的方向、透明度等等設(shè)定。你也可以選擇 Frames 工具列設(shè)定移動(dòng)速度,選擇 Object 面版來(lái)改變?cè)O(shè)定。要匯出檔案時(shí),只要選擇 Optimize 工具列,在檔案類(lèi)型的地方選擇 Animated GIF。完成以后,F(xiàn)ireworks 就會(huì)自動(dòng)將圖片以好化設(shè)定匯出,并且自動(dòng)將 GIF 圖檔更新,還會(huì)在 Dreamweaver 里將更新過(guò)的圖檔秀出來(lái)。選擇 File ·Preview in Browser,這樣就可以在瀏覽器里預(yù)覽剛剛制作完成的可愛(ài)圖檔!
本文題目:Dreamweaver技巧大放送前六招
當(dāng)前URL:http://www.rwnh.cn/news/172855.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供全網(wǎng)營(yíng)銷(xiāo)推廣、電子商務(wù)、外貿(mào)建站、網(wǎng)站營(yíng)銷(xiāo)、網(wǎng)站策劃、關(guān)鍵詞優(yōu)化
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容