用Dreamweaver制作網(wǎng)頁(yè)中常用的過渡效果
我要評(píng)論制作步驟：
1、 打開一個(gè)頁(yè)面，這一步非常關(guān)鍵。為什么要打開一個(gè)頁(yè)面，而不是在編輯過程中進(jìn)行設(shè)置呢?這是因?yàn)榫W(wǎng)頁(yè)過渡的代碼必須在代碼窗口的一些特定區(qū)域顯示才能起作用。而剛打開的窗口，光標(biāo)在代碼窗口的最上一行的最前邊，是合適的位置之一，對(duì)于不熟悉代碼者來說，這樣簡(jiǎn)單、易操作。但有些網(wǎng)頁(yè)剛打開時(shí)光標(biāo)也不在代碼窗口的最上一行的最前邊，那要通過邊框的滾動(dòng)條找到代碼的第一行，然后在最前邊點(diǎn)擊鼠標(biāo)，把光標(biāo)定位在代碼窗口的最上一行的最前邊。
2、單擊菜單欄中的插入-HTML-文件頭標(biāo)簽-Meta，會(huì)彈出Meta對(duì)話框。
3、在對(duì)話框中的屬性選項(xiàng)的下拉列表中選HTTP-equivalent選項(xiàng)，在值一格中鍵入Page-Enter，表示進(jìn)入網(wǎng)頁(yè)時(shí)有網(wǎng)頁(yè)過渡效果。 在內(nèi)容一格中鍵入 Revealtrans(Duration=4,Transition=2)，Duration=4 表示網(wǎng)頁(yè)過渡效果的延續(xù)時(shí)間為4秒，Transition表示過渡效果方式，值為2時(shí)表示圓形收縮，各種效果數(shù)字代碼如下。
4、輸入完后單擊確定，保存。這樣當(dāng)我們進(jìn)入這個(gè)頁(yè)面時(shí)就可以看到效果了。剛才你看到效果了吧!要不然你再回到主頁(yè)，再到這一頁(yè)看一下。
5、另外還有二十多種效果供你選擇，只要將Transition的值改為相應(yīng)的效果的代號(hào)即可，具體效果和設(shè)置如下表所示 ：
效果 Transition 效果 Transition
盒狀收縮 0 溶解 12
盒狀展開 1 左右向中部收縮 13
圓形收縮 2 中部向左右展開 14
圓形展開 3 上下向中部收縮 15
向上擦除 4 中部向上下展開 16
向下擦除 5 階梯狀向左下展開 17
向左擦除 6 階梯狀向左上展開 18
向右擦除 7 階梯狀向右下展開 19
垂直百葉窗 8 階梯狀向右上展開 20
水平百葉窗 9 隨機(jī)水平線 21
橫向棋盤式 10 隨機(jī)垂直線 22
縱向棋盤式 11 隨機(jī) 23
相關(guān)文章
- 本文主要介紹了菜單欄 “三” 變形為“X”css3過渡動(dòng)畫的實(shí)現(xiàn)方法。具有很好的參考價(jià)值，下面跟著小編一起來看下吧2017-02-28
- 本篇文章主要介紹了Css3新特性應(yīng)用之過渡與動(dòng)畫，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-01-10
- 大家都知道過渡動(dòng)畫是動(dòng)畫的基礎(chǔ)，在學(xué)習(xí)動(dòng)畫屬性之前，我們需要先了解過渡屬性transition，下面這篇文章通過示例代碼給大家詳細(xì)介紹了CSS3中的元素過渡屬性transition，有2016-11-30
- 下面小編就為大家?guī)硪黄獪\談CSS過渡、動(dòng)畫和變換。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧，祝大家游戲愉快哦2016-07-21
css過渡+3D效果的簡(jiǎn)單實(shí)現(xiàn)
下面小編就為大家?guī)硪黄猚ss過渡+3D效果的簡(jiǎn)單實(shí)現(xiàn)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-07-14- 這篇文章主要為大家詳細(xì)介紹了CSS3過渡transition效果實(shí)例，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-05-03
css3過渡_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要為大家詳細(xì)介紹了css3過渡的相關(guān)資料，用CSS3做一些過渡效果和動(dòng)畫，特別適合Web前端開發(fā)員學(xué)習(xí)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-11