基本的な導入は、transformプロパティを
新しいCSS3のプロパティを変換する、あなたは、変換プロセスでのトランジション効果素子を作る基本的な実現可能なアニメーションを。
遷移的语法:移行:移行-プロパティ|| 遷移期間||
遷移タイミング-funciton || 遷移遅延。
パラメータは以下の値を持って説明します。
<遷移プロパティ>:遷移プロパティを定義します。
<遷移期間>:移行プロセスを定義するのに必要な時間。
<遷移タイミング機能>:遷移を定義します。
<遷移遅延>:遷移遅延時間の開始を定義します。
属性定義トランジショントランジション効果、上記の4つのパラメータのセットを使用します。スペースで区切られた中間遷移プロパティ速記。トランジション効果も同時にグループ間のカンマで区切られた2つ以上のグループを定義することができます。
htmlコード:
<!DOCTYPE HTML>
<HTML LANG = "EN">
<HEAD>
<メタ文字コード= "UTF-8">
<タイトル>の移行</ TITLE>
<リンクのrel = "スタイルシート"のhref =」../ CSS /移行.css ">
</ HEAD>
<BODY>
<div>
<divのクラス= "TY"> </ div>
</ div>
</ BODY>
</ HTML>
CSSコード:
.ty {
幅:200pxの。
高さ:200pxの。
背景色:赤。
マージン:自動;
遷移:地色.5sは、使いやすさに.5s。
}
.ty:ホバー{
背景色:青。
}
転移性の1つ、速記の使用に注意してください。ホバータグの中間体を使用して、4つの属性を定義するシーケンシャル開口の順序を記述する。DIVときにマウスを上に移動すると効果が示されています。5秒後に高速赤から背景色が遅いから5秒以内に黄色結果に。
キー:CSS3遷移は徐々に別の効果のために一つのスタイルから変更する要素です。これを達成するために、二つのことを定義する必要があります。
-
私は、CSSプロパティの効果を追加したいです
-
効果の持続時間を指定します。