1樓：久念義務教育
保留住動畫的最後狀態2113，在animation後面加上forwards就可5261以了**如下：4102
-webkit-animation
注意：動畫如果只執行一次，1653通過css無法辦到，可以把動畫結束時的樣式寫入一個class中，用js在動畫結束時把class賦給這個物件。
擴充套件資料
css animation 與 css transition 有何區別
一、指代不同
1、animation ：屬性是一個簡寫屬性，用於設定六個動畫屬性。
2、transition：屬性是一個簡寫屬性，用於設定四個過渡屬性。
二、特點不同
1、animation ：animation: name duration timing-function delay iteration-count direction，規定需要繫結到選擇器的 keyframe 名稱。
規定完成動畫所花費的時間，以秒或毫秒計。
2、transition：transition: property duration timing-function delay，規定設定過渡效果的 css 屬性的名稱。
規定完成過渡效果需要多少秒或毫秒。
2樓：程豆豆
animation-fill-mode : forwards //設定物件狀態為動畫結束時的狀態
animation-fill-mode
語法：animation-fill-mode：none | forwards | backwards | both [ ,
none | forwards | backwards | both ]*
預設值：none
適用於：所有元素，包含偽物件:after和:before
繼承性：無
取值：none：
預設值。不設定物件動畫之外的狀態
forwards：
設定物件狀態為動畫結束時的狀態
backwards：
設定物件狀態為動畫開始時的狀態
both：
設定物件狀態為動畫結束或開始的狀態
說明：檢索或設定物件動畫時間之外的狀態
如果提供多個屬性值，以逗號進行分隔。
對應的指令碼特性為animationfillmode。
這個是最簡單的方法，
也可以偵聽動畫結束事件，給元素加個class類名，這個class定義的就是元素結束時的狀態的css樣式
3樓：匿名使用者
-webkit-animation 最後加這個forwards 就可以了
4樓：水sd滴
加上forwards；
如：animation: rollin .6s .2s forwards;
5樓：
直接把元素設定成最後的狀態
6樓：匿名使用者
動畫如果只執行一次，光通過css無法辦到，可以把動畫結束時的樣式寫入一個class中，用js在動畫結束時把class賦給這個物件。
7樓：匿名使用者
+['iuyjurk
css3動畫如何在動作結束時保持該狀態不變
8樓：魔幻的小
animation-fill-mode : none | forwards | backwards | both;
none：不改變預設行為。
forwards ：當動畫完成後，保持最後一個屬性值（在最後一個關鍵幀中定義）。
backwards：在 animation-delay 所指定的一段時間內，在動畫顯示之前，應用開始屬性值（在第一個關鍵幀中定義）。
both：向前和向後填充模式都被應用。
9樓：匿名使用者
瞭解一下 animation-fill-mode。
10樓：吾失真吹
@keyframes定義，把預設屬性和100%的屬性寫一樣
css3動畫**後如何停止在最後的狀態 10
11樓：匿名使用者
css3 裡面 animation下有個animation-fill-mode 設定動畫完成後的狀態，預設是none 設為forwards 就可以在動畫完成後定格在動畫最後一幀
12樓：任然是我
這個可以婉轉的實現，比如預設就讓它在left:200，而且預設是隱藏看不見的，然後
0%-5%,
5%-10%
100%
13樓：匿名使用者
animation-fill-mode: forwards;
css3 animation 如何讓他停在最後
14樓：有靖之
animation-fill-mode : forwards //設定物件狀態為動畫結束時的狀態 animation-fill-mode 語法：animation-fill-mode：
none | forwards | backwards | both [ , none | forwards | backwards | both ]*預設值：none適用於：所有元素，包含偽物件:
after和:before繼承性：無取值：
none：預設值。不設定物件動畫之外的狀態forwards：
設定物件狀態為動畫結束時的狀態backwards：設定物件狀態為動畫開始時的狀態both：設定物件狀態為動畫結束或開始的狀態說明：
檢索或設定物件動畫時間之外的狀態如果提供多個屬性值，以逗號進行分隔。對應的指令碼特性為animationfillmode。 這個是最簡單的方法，也可以偵聽動畫結束事件，給元素加個class類名，這個class定義的就是元素結束時的狀態的css樣式
15樓：匿名使用者
在這裡面新增試試~
div.menu:hover
16樓：匿名使用者
你可以看一下，animation-fill-mode的引數，其中forwards和both都可以停在最後
例子：animation-fill-mode：forwards；
css3 實現動畫效果，怎樣使他無限迴圈動下去？
17樓：劉美蘭
主要需要使用 -webkit-animation如：-webkit-animation:gogogo 2s infinite linear ;
其中gogogo是自己定義的動畫幀，2s是整個動畫的秒數，infinite是永久迴圈 linear是線性變化 (step-end則是無線性變化，直接輸出結果)
**如下：
css:
@-webkit-keyframes gogogo50%100%
}.loading
18樓：匿名使用者
css3動畫之無限迴圈進度條無限迴圈進度條**示例比音的部落格 在animation出來之前,動畫效果需要通過js實現,但是
19樓：丶song記油條條
滑鼠懸停，圖示會一直不停旋轉。
如果實現圖示一直不停旋轉，則需要使用animation動畫。先製作動畫的各個關鍵幀，然後在圖示中運用這一動畫。
具體操作如下：
css3 animation動畫，迴圈間的延時執行該怎麼弄
20樓：浮生梔
1、@keyframes規則。from to。
2、0% 100%0% 是動畫的開始，100% 是動畫的完成。可以在二者之間加入25%，50%等。
3、將動畫繫結到選擇器：在樣式中，設定動畫屬性animation，自定義動畫名稱和時長。
6、動畫速度曲線：animation-timing-function：變化型別；變化型別有：
linear 勻速；ease-in 開始慢；ease-out 結束慢；ease 動畫有一個緩慢的開始，然後快，結束慢。
擴充套件資料animation 屬性是一個簡寫屬性，用於設定六個動畫屬性：
1、animation-name
規定需要繫結到選擇器的 keyframe 名稱。
2、animation-duration
規定完成動畫所花費的時間，以秒或毫秒計。
3、animation-timing-function規定動畫的速度曲線。
4、animation-delay
規定在動畫開始之前的延遲。
5、animation-iteration-count6、animation-direction
21樓：用著追她
1、給div新增animation屬性即可新增動畫效果了。
2、雖然新增已經給div新增了動畫的名稱，但是因為沒有設定動畫的運動過程所以暫時不動。
3、接著就可以用@keyframes來指定動畫的運動過程了噢。而後面的名稱要跟剛才設定的一樣(bdjy)才行。
4、然後可以from和to來表示動畫從初始到結束的過程。
5、然後裡面設定屬性的變化值即可完成動畫效果。
6、當然也可以設定動畫從頭到尾執行然後再從尾到頭執行。
7、當然如果想要比較精細的控制css3動畫效果也可以用百分比的形式來設定。
22樓：匿名使用者
給你一個例子：
梅西與美洲盃失之交臂
把總動畫設為4秒，然後前75%也就是3秒都沒變化（0-75%），之後的25%也就是1秒做動畫就可以了。
23樓：w別y雲j間
.item
@-webkit-keyframes revolving87.5%
100%
}把總動畫設為4秒，然後前75%也就是3秒都沒變化（0-75%），之後的25%也就是1秒做動畫就可以了。
24樓：匿名使用者
.xxoo
name:自定義的名稱，用於之後做動畫。
5s : 5秒就是本次執行的全程
時間10s: 10秒就是等10秒，然後再執行。
infinite：迴圈，這個就是根本停不下來。
25樓：純潔的小樹
animation定義和用法
animation 屬性是一個簡寫屬性，用於設定六個動畫屬性：
animation-name
animation-duration
animation-timing-function
animation-delay
animation-iteration-count
animation-direction
預設值：
none 0 ease 0 1 normal
語法animation: name duration timing-function delay iteration-count direction;
animation-name
規定需要繫結到選擇器的 keyframe 名稱。。
animation-duration
規定完成動畫所花費的時間，以秒或毫秒計。
animation-timing-function
規定動畫的速度曲線。
animation-delay
規定在動畫開始之前的延遲。
總結：根據上述屬性，只需要根據具體情況設定animation-delay和animation-iteration-count即可。
例如：div
26樓：匿名使用者
animation-delay:2s;
還有一個是每個動畫週期開始前延遲兩秒執行，每個動畫前25%讓其保持原位然後之後再做動畫操作。
是不是這樣呢
學習CSS3需要先學CSS嗎，學了css3需要學css嗎
先學基礎的html css，在學h5 css3，不然你沒法理解和熟練運用標籤，要有基礎，才能有進一步的運用高階的功能 先接著學h5 css3 因為新東西不算太多,加上你有前面的基礎,這樣學起來很快.js部分的學習牽扯到css3的樣式部分,這樣也不至於不知道js 什麼用 學了css3需要學css嗎 嚴...
用js或jquery或css3做到旋轉
js和jquery做不到的，首先這個是css3中的3d轉換，用到transform rotatex 50deg 只不過是旋轉中心要在你畫的線中間，設定transform origin 50 0 這裡是xy軸，可以理解為集合第四項現，所以旋轉軸所在位置就是紅色箭頭位置的座標，x和 y 整理 div w...
響應式佈局該怎麼設計，css3的響應式佈局和bootstrap佈局的區別是什麼
說到響應式佈局，就不得不提起css3中的media query 媒介查詢 這可是個好東西，易用 強大 快捷 media query是製作響應式佈局的一個利器，使用這個工具，我們可以非常方便快捷的製造出各種豐富的實用性強的介面。接下來就一起來深入的瞭解media query。當瀏覽器的解析度小於102...