ホームページ > ウェブフロントエンド > htmlチュートリアル > 新たなスタート、新たな方向性

新たなスタート、新たな方向性

WBOY
リリース: 2016-06-16 08:39:25
オリジナル
1058 人が閲覧しました

社会人になった2016年3月から今の6月まで、少しずつ自分が本当にやりたいことが見つかった今日、CSS3を勉強していたら、文法や書き方が大きく変わっていることに気づきました。マークも新しいことを学びました。毎日小さな一歩を踏み出し、ゆっくりと積み重ね、学び続け、一生懸命働き続け、決して諦めないでください。

例:

前の書き込み: 女性;

現在の書き込み: 女性;

新しいタグもたくさん学びました。例: -引用テキスト、border-radius-角の丸い設定、

background:linear-gradient-gradient 例:background:linear-gradient(45deg,red, yellow,blue); 45度からグラデーションを開始する赤、黄、青の3色を設定します。

2D 変換:

たとえば、transform:rotate(30deg); 30 度回転

を使用できます。

アニメーション : アニメーションは、要素を 1 つのスタイルから別のスタイルに徐々に変更する効果です。

アニメーション:mx 5s リニア無限 (アニメーション: アニメーション名、時間、グラデーション方法、再生方法)

//キーワード「from」と「to」、0% と 100% に相当。

// 0% はアニメーションの開始をオレンジ色で表示し、100% はアニメーションの終了を示し赤色で表示します。

最初の方法: @keyframes mx{

from{背景:オレンジ;}

から {背景:赤;}

}

方法 2 : アニメーションが 25% と 50% になったときに背景色を変更し、アニメーションが 100% 完了したときに再度変更します。

 @keyframes mx{
0%   {background: red;}
25%  {background: yellow;}
50%  {background: blue;}
100% {background: green;}
}<br>等等。。。。。。。。。
ログイン後にコピー
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート