ホバー時のCSS3の効果

ホバー時の CSS3 のいくつかの効果のコード共有、マウスが上を通過するときの CSS3 のいくつかの効果のコレクション

効果 1: 360° 回転して回転 (回転の度合い) を変更します

* {
トランジション: すべて 0.4 秒のイーズ-in- out;
- webkit-transition：0.4s ease-in-out; (360deg);
-o-transform:rotate(360deg);
-ms-transform :rotate(360deg);
}

効果 2: ズームインしてスケールを変更します (拡大値)
* {
transition:All 0.4s容易さ;
webkit-transition：0.4s ease-int;効果 3: 回転と拡大 回転 (回転度) スケール (増幅値) を変更します。 ）

* {s 's- ‐ ‐ ‐ ‐ webkit-transitionの使用：すべて0.4s容易な移動;すべての0.4s容易さ。 ;

-o-transform:rotate(360deg)scale(1.2);

-ms-transform:rotate(360deg)scale(1.2) ;
}


効果 4: 上下左右に移動して移動を変更します(x 軸、y 軸)

* {
” トランジション:すべて 0.4 秒イーズインアウト;
” -webkit-transition: すべて 0.4 秒イーズイン-アウト;
-moz-transition:全て0.4イーズインアウト;
-webkit-transform:translate(0,-10px);
-moz-transform:translate(0,-10px);
-o-transform:translate(0,-10px);
-ms-transform:translate( 0,-10px);

}

ホバー時の CSS3 の効果に関連するその他の記事については、PHP 中国語 Web サイトに注目してください。