2015年10月27日: CSSだけでアニメーションを作成（keyframes）

【ソリューション事業部　ワケ】

はじめまして、10月よりデジアラの一員となりました。ワケと申します。
よろしくお願いいたします。

私は主にHTMLコーディングを担当させていただいています。
HTMLコーディングとは、デザイナーの方が作成されたデザインをブラウザで見られるようにする作業の事です。HTMLとCSSというものを使用しています。

ものすごーく、ざっくりと言いますと
HTMLは文字や画像を表示するためのもの
CSSは色やサイズ、レイアウト、背景色などを設定するためのものです。

HTMLだけでの表示とHTMLとCSSを使用した表示のサンプルです。

現在広く使われているのはCSS2ですが、CSS3も徐々に利用され始めています。
CSS3を使うとアニメーション、動きのある表示も表現できます。
これまで動きのある表現は、JavaScript等のプログラム言語を使う必要がありました。

ですが、CSS3を使うとプログラム言語を使わないでも、ある程度のアニメーションを作ることができます。
という事で、”CSSだけでアニメーション”のサンプルを作成しました。

プログラムは使っていません。
「安心してください。CSSだけですよ。」

ご興味がございましたら、ご覧ください。