隨著h5頁面的宣傳優(yōu)勢，越來越的企業(yè)做活動開始追求移動端的展示效果，接下來我們就開始教大家如何用css3實(shí)現(xiàn)這樣的h5動畫頁面效果。

        首先建立文件之后，給背景來一個青藍(lán)色的天空，直接給body設(shè)置一個背景顏色即可，再插入一張plane的飛機(jī)圖片，這樣，準(zhǔn)備工作就完成了；

       接下來，飛機(jī)默認(rèn)位置是頂著坐上角的，這樣令人很不舒服，咱們可以給他一個postion的定位，放置到一個自己覺得舒服的地方，好了，可以開始制作動畫的代碼了，css3提供了兩種動畫形式的代碼，其中之一是animation，fei——這個動畫的名字，2s——這個動畫的時長，接下來的代碼，是書寫animation動畫的標(biāo)準(zhǔn)格式，0%是指動畫一開始是什么狀態(tài)，100%那當(dāng)然是指動畫結(jié)束時候的狀態(tài)。

假設(shè)我們想要飛機(jī)上下飛，那么需要輸入transform這個代碼來指定飛機(jī)要變了，冒號后面的意思是指要移動Y軸移動變化，單位是30個像素，好了，做到這里，就可以預(yù)覽到飛機(jī)可以飛了，等會，看起來是不是有點(diǎn)傻，從下往上飛，然后循環(huán)？，不對啊，我們希望看上去，應(yīng)該是，上下上下這樣循環(huán)??！是不是很多人想到了，只要加入中間那個50%的代碼，小修改一下參數(shù)就可以了。