css動畫的建立和使用

2021-09-19 16:44:15 字數 1002 閱讀 8079

1、定義動畫

@keyframes 規則用於建立動畫。在 @keyframes 中規定某項 css 樣式,就能建立由當前樣式逐漸改為新樣式的動畫效果。

@keyframes myfirst

to }

@-moz-keyframes myfirst /* firefox */

to }

@-webkit-keyframes myfirst /* safari 和 chrome */

to }

@-o-keyframes myfirst /* opera */

to }

2、使用動畫

通過規定至少以下兩項 css3 動畫屬性,即可將動畫繫結到選擇器:

把 「myfirst」 動畫**到 div 元素,時長:5 秒:

div

css3 動畫屬性

下面的**列出了 @keyframes 規則和所有動畫屬性:

屬性描述

@keyframes

規定動畫。

animation

所有動畫屬性的簡寫屬性,除了 animation-play-state 屬性。

animation-name

規定 @keyframes 動畫的名稱。

animation-duration

規定動畫完成乙個週期所花費的秒或毫秒。預設是 0。

animation-timing-function

規定動畫的速度曲線。預設是 「ease」。

animation-delay

規定動畫何時開始。預設是 0。

animation-iteration-count

animation-direction

animation-play-state

規定動畫是否正在執行或暫停。預設是 「running」。

animation-fill-mode

規定物件動畫時間之外的狀態

css檔案的建立和使用

在css資料夾中建立乙個 css檔案 在 css檔案中寫css樣式,比如 news 其中news是這個樣式的名字,在新建乙個css樣式時,有.和 兩種寫法,區別在於.是class屬性,是id屬性,即 用.定於的樣式可應用於任何標籤,class 而用 定義的樣式只能應用於某個標籤,id 4.在jsp中...

DLL的建立和使用

我們將建立的第一種型別的庫是動態鏈結庫 dll 使用 dll 是一種重用 的絕佳方式。您不必在自己建立的每個程式中重新實現同一例程,而只需對這些例程編寫一次,然後從需要該功能的應用程式引用它們即可。本演練涵蓋以下內容 建立新的動態鏈結庫 dll 專案。向動態鏈結庫新增類。建立引用動態鏈結庫的應用程式...

Qt contextMenu的建立和使用

qt中的部件的彈出選單 contextmenu 依據contextmenupolicy的值的不同,有四種形式 一 預設選單 此時,contextmenupolicy的值為qt defaultcontextmenu,這是預設值,其將顯示部件定義的預設選單 二 無選單 此時,contextmenupol...