本講座の流れ
本講座は大きく３つのチャプターに分かれています。
- CSS編
- bootstrap&jQuery編
- アドバンス編
レッスンで使用するサイトについて
CSS編、bootstrap&jQuery編のレッスンや実習では、ポートフォリオサイトに動きを加える箇所があります。
素材ファイルとして元となるポートフォリオサイトをご用意しています。
コースの素材タブ、もしくは下記よりexercise-set.zipをダウンロードしてご利用下さい。
実習について
各レッスンには「実習」として練習問題をご用意しています。 レッスン内容の理解のために、ぜひチャレンジてみて下さい。 実習で作成したファイルの提出は不要です。
実習の答えについて
実習の解答となるスタイル指定は、コース素材（exercise-set.zip）の中にある「exercise.css」に記載しています。
「exercise.css」の初期状態は空です。
各レッスンの素材欄には解答入りのファイルがありますので、そちらをダウンロードしてご確認下さい。
なお、ご自身で追加作成するスタイル指定は、cssファイルを分ける必要はありません。 style.css内に記述して下さい。
実習解答の確認方法
解答ファイル（exercise.css）をスムーズに確認頂けるよう、素材（exercise-set.zip）フォルダ内のindex.htmlには予めexercise.cssの読み込みが記述されています。
解答を確認する際には、コメントアウトを外してファイルを読み込んで下さい。
- 素材からexercise.cssをダウンロード
- 作成中のサイト内、cssフォルダにexercise.cssを移動する（上書き）
- htmlファイルのコメントアウトを外し、exercise.cssを読み込ませる
上記の流れで解答を確認してください。 下記では解答ファイルの使い方を詳しく説明します。
１.素材から解答ファイルをダウンロード
各レッスンページから、実習の答えが入っているファイルをダウンロードして下さい。 「レッスンの素材一覧」の方です。
２.解答ファイルを移動する
ダウンロードしたファイルを、作成中のフォルダ内のcssフォルダに移します。
既存のファイルを上書き（置換）するか聞かれます。 上書きする/置き換えるを選択して下さい。
３.コメントアウトを外す
index.htmlのhead内にある、exercise.css読み込み部分のコメントアウトを外します。
保存して、ブラウザで表示を確認してください。 確認が終わったら再びコメントアウトしておきましょう。
◆ css以外のファイルもある場合
css以外にも変更点がある場合は、zipファイルがアップロードされています。
htmlファイル等は、作成中のファイルを上書きしないように命名されています。
htmlファイルであれば第一階層に、jsファイルであればjsフォルダに移動させて使用して下さい。 exercise.css のみ “２.解答ファイルを移動する” の方法で上書き（置き換え）してください。
