新しいレッスンがあります
旧版のレッスンは更新を終了しており、現状と異なる場合があります。サポートも終了しておりますので、最新版への移行をお願いします。
-
#01 実践的なレイアウト手法を学ぼう (02:57) 無料公開中
- レッスンの概要
- 必要な知識
- 必要なツール
- ひな形ファイルの作成
- CSSのリセット
-
#02 1カラムのレイアウト (02:59) 無料公開中
- 要素の作成
- CSSの設定
- 幅の設定
- 中央揃えの設定
-
#03 2カラムのレイアウト (可変幅) (02:51) 無料公開中
- 可変幅の2カラムレイアウト
- 回りこみの解除
- 一方が固定幅の2カラムレイアウト
-
#04 2カラムのレイアウト (固定幅) (02:51) 無料公開中
- 固定幅の2カラムレイアウト
-
#05 3カラムのレイアウト (可変幅) (02:35)
- 可変幅の3カラムレイアウト
-
#06 3カラムのレイアウト (固定幅) (02:59)
- 固定幅の3カラムレイアウト
- マージンの相殺
-
#07 文書の構造を作っていこう (02:42)
- 文書構造の記述
-
#08 2カラムレイアウトを作ろう (02:56)
- 固定幅の2カラムレイアウト
-
#09 背景を設定しよう (02:49)
- 背景画像の設定
- #containerのスタイル作成
- font-familyの設定
-
#10 ヘッダーとフッターを作ろう (02:57)
- ヘッダー
- メニュー
- フッター
-
#11 メニューを作ってみよう (02:46)
- メニューの横並び設定
- メニューのスタイル設定
-
#12 見出しと本文を作ってみよう (02:54)
- 見出しと本文
- スタイルの設定
-
#13 画像付きリストを作ってみよう (02:59)
- 画像付きリスト
- スタイリング
-
#14 キャプション付き画像を作ろう (02:36)
- 画像の配置
- キャプションの配置
-
#15 バッジを付けてみよう (02:21)
- バッジの作成
- スタイリングと配置
-
#16 アイコン付きリストを作ろう (02:03)
- リストのスタイリング
ギャラリー
あわせて読みたい
-
HTMLとCSSを使って思い通りのレイアウトを実現するためのテクニックが網羅されている本です。
このレッスンについて
- 最終更新日
- 2013年12月9日
- 関連キーワード (5)
