このレッスンのサポートは終了しました
このレッスンの最終更新日は 2015年12月2日 です（質問の受付は終了しました）。
-
#01 CSSでレイアウトを組み上げよう (02:59) 無料公開中
- 概要
- 必要となる知識
- 必要となるツール
- ひながたファイルの作成
-
#02 reset.css､normalize.cssを使おう (02:55) 無料公開中
- User Agent Stylesheet
- reset.css
- normalize.css
-
#03 Developer Toolsを使ってみよう (01:47) 無料公開中
- Develper Toolsの起動
- Elementsパネルの見方
-
#04 ワンカラムレイアウトを作ろう (02:43) 無料公開中
- ワンカラムレイアウト
- 内容を固定幅にする方法
- footerの背景色を指定する方法
-
#05 アイキャッチ画像を配置してみよう (02:49)
- アイキャッチ画像の配置
- background-sizeプロパティ
- background-positionプロパティ
-
#06 2カラムレイアウトを作ってみよう (02:39)
- float
- clear
- 親要素の高さを出す方法
-
#07 clearfixを使ってみよう (02:25)
- cleafix
- overflow:hidden
-
#08 カラムに余白をつけてみよう (02:51)
- marginの付け方
- paddingの付け方
- box-sizing
-
#09 3カラムレイアウトを作ってみよう (02:50)
- 3カラムレイアウト
-
#10 可変幅のカラムを作ってみよう (03:00)
- 可変幅のカラム
-
#11 リストでメニューを作ってみよう (02:35)
- ヘッダーメニューの作り方
-
#12 メニューを完成させよう (01:57)
- マウスオーバーしたときの動作
-
#13 positionプロパティで使ってみよう (02:49)
- positionプロパティ
-
#14 画像付きリストを作ってみよう (02:51)
- 画像付きリスト
-
#15 画像付きリストを完成させよう (03:01)
- 画像付きリスト
- li要素の最後だけスタイルをあてない方法
#right {
background: lightgreen;
float: left;
width:...
この動画内で、親要素の背景色を反映させるために以下のようなコードを使用しています。
.clearfix:aft...
動画内で font-size: 0; にしたあと a に font-size: 16px; と指定として余白を...
styles.css に main.product ではなく main .product と書かれていますが、...
動画内で「幅と高さはそこに含まれる画像のものにしたいので、 display: inline-block; 」と説明され...
