言語を学ぶ

HTML&CSSでつくる斜め型ボックスレイアウト

HTML&CSSでつくる斜め型ボックスレイアウト

チャプター:6

このブックでは、HTMLとCSSを使用して 斜め型ボックスのレイアウトのつくり方を学習していきます。

1.HTML構造をつくる

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

28P

2.「箱」の装飾をしよう

このチャプターでは前回までのチャプターで作成したHTML構造のうち、「box」というクラス名のついた要素・それに関連する要素にCSSで装飾を加えていきます。

34P

3.タイトル部分の装飾をしよう

このチャプターでは、タイトル部分を表すh1要素の装飾をCSSで行っていきます。

30P

4.文章部分の装飾をしよう

このチャプターでは、文章部分を表すp要素の装飾をCSSで行っていきます。

32P

5.共通部分の作成

このチャプターでは、boxの上下につける「斜め」部分のうち、上下で共通する部分の装飾を行います。

38P

6.斜めレイアウトの実装

このチャプターでは、前回のチャプターで行った設定を活用して斜め線レイアウトを追加します。

32P