Dreamweaver中導航菜單需要添加過渡動畫效果，這就需要會使用transition過渡屬性，下面我們就來看看詳細的教程。

1、在Dreamweaver中構建一個簡單導航，如下圖所示，設置文字顏色和背景色

2、點擊打開文件中的-拆分

3、可以在軟件中實時預覽效果

4、對其中的li添加：hover屬性，當鼠標經過li時，字體和背景顏色發生變化，如圖當鼠標經過li時，背景顏色變為黃色，字體變為黑色

li:hover{background-color:yellow;color:black;｝

5、在li:hover{}  中添加transition過渡動畫，transition后面添加變化的屬性及屬性變化的時間，如下圖所示transition:background-color 0.5s;意思是對background-color背景顏色設置過渡動畫，當鼠標經過li時，背景顏色會慢慢變為黃色，中間時間為0.5s

6、如果里面包含多個屬性時，transition后面的屬性可以使用all來代替，比如這里的背景顏色和字體顏色兩個屬性，使用all全部代替，當鼠標經過Li時，字體和背景顏色會慢慢改變

7、如果在hover中設置文字字號，設置為字號50號時，當鼠標經過li時，字體會慢慢變大，形成一個動畫效果

以上就是dw中transition過渡屬性的使用方法，希望大家喜歡，請繼續關注武林網。

相關推薦：

Dreamweaver單元格怎么拆分合并?

Dreamweaver怎么輸入文本并設置文本樣式?

dreamweaver怎么實現鼠標放在不同的位置顯示不同的圖片?