CSS その他

レガシーブラウザの対応

・プログレッシブ・エンハンスメント 　　レガシーブラウザを基準に新しい機能をサポートしているブラウザによリリッチな体験を提供する ・グレースフルデグラデーション 　　モダンブラウザを基準に古いブラウザには必要最低限の機能を提供する ・ポリフィル 　　標準ではサポートしていない機能をJavaScriptのライブラリなどを使用してサポートさせる手法 　　例) html5shiv.js Respond.js

perspective

・Web フォント http://fonts.com/ja https://typekit.com https://typesquare.com モリサワ http://webfont.fontplus.jp

・アイコンフォント http://zurb.com/playground/foundation-icon-fonts-3 https://www.entypo.com http://fontello.com

・アニメーション transition: 2s; transition-duration: 2s; transition-delay: 1s; transition-property: background-color; transition-timing-function: ease-in; http://matthewlein.com/ceaser/ ショートハンド transition: background-color 2s ease-in 1s;

・キーフレームアニメーション

animation-timing-function: ease-in animation-iteration-count: infinite; animation-direction: alternate; (再生方向) animation-fill-mode: forwards; animation-play-state: (再生状態)(running or paused); アニメーションのショートハンド animation: アニメーション名 再生時間 イージング 再生までの時間 再生回数 再生方向 再生前後の表示 再生状態;

・GPUアニメーション transform, opacity, filter