言語を学ぶ

HTML&CSS3でつくる飛び出るボタン

HTML&CSS3でつくる飛び出るボタン

チャプター:5

このブックでは、CSS3を利用して マウスを乗せた際に飛び出るボタンを作成します。このブックを通して、CSS3による「アニメーション」の応用について学習することができます。

1.HTML構造をつくる

このチャプターでは、レイアウトの基盤となるHTML構造を作成します。

26P

2.タイトルの装飾

このチャプターではCSSを利用してタイトル部分の装飾を行っていきます。

28P

3.「ボタン」の装飾

この要素は、ボタン部分である、「btn」をクラス名に持つ要素の装飾を行っていきます。

48P

4.マウスオーバーしたボタンの装飾

このチャプターでは、マウスカーソルが乗せられた状態でのボタンの装飾を行います。

32P

5.アニメーションの追加

このチャプターでは、CSS3を利用して マウスオーバーした際のアニメーションを追加します。

36P