1、通過CSS3的@font-face屬性引入本地字體
2、調用自定義的字體
3、設置3D舞臺布景
4、給3D舞臺布景設置過渡動畫效果
5、給不是當前狀態的3D舞臺的懸浮與聚焦狀態設置變形效果
6、給3D舞臺中“.three-d-box”設置過渡與變形效果
7、給導航設置3D前，與3D后變形效果
8、設置導航當前狀態與懸浮狀態下的背景效果
9、顯示下拉導航菜單，并其設置一個變形效果
提示1：
使用@font-face引入本地字體，本地字體的路徑為：
http://www.w3cplus.com/demo/css3/3DAnimationDropdownMenu
同時提供自定義字體：
“sansation_regular-webfont.eot”、“sansation_regular-webfont.woff”、“sansation_regular-webfont.ttf”和“sansation_regular-webfont.svg”
提示2：
通過font-family調用自定義的字體名“sansationregular”。
提示3：
在元素”.three-d”上使用“perspective”給元素設置3D舞臺布景，并且將其值設置為”200”
提示4：
通過transition給3D舞臺設置過渡動畫，設置的參數為所有屬性“all”,過渡時間持續“0.07s”，使用的過渡函數為“linear”。
提示5：
給不是當前狀態的3D舞臺的懸浮與聚焦狀態設置旋轉效果，也就是“.three-d:not(.active):hover”和“.three-d:not(.active):focus”狀態下的“.three-d-box”設置z軸位移“-25px”，X軸旋轉“90deg”。
提示6：
給3D舞臺中的“.three-d-box”元素設置過渡效果，并且對其Z設置一個“-25px”旋轉。
提示7：
在.front”元素上設置X軸的旋轉，旋轉度為0，同時給Z軸位移25px。另外給“.back”元素上設置X軸的旋轉，旋轉度為-90deg，同時Z軸位移25px。
提示8：
通過CSS的漸變與背景尺寸實現導航當前狀態與懸浮狀態下的斑紋背景效果。
請驗證，完成請求
由于請求次數過多，請先驗證，完成再次請求
打開微信掃碼自動綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報
