Sponsored Link
前回はCodePenを使ってレイアウトで遊ぶ演習を行いました。
今回からはWebサイトコーディング[LEVEL EASY]のコーディングを行ってみましょう。
レイアウトで遊ぼうの課題の修正
前回提出した課題の確認をして必要があれば間違った点を訂正していきたいと思います。
まずはCodePenにログインしておきましょう。
ログインするとみなさんそれぞれの「Your Work」のページが開き、編集したPenの一覧が表示されます。
一覧の中から以下のテキストリンクになっているPenを順にCtrl + クリックみましょう。
- コーディング応用:Flexbox逆さ積み木
- コーディング応用:Flexbox入れ子レイアウト
- コーディング応用:Flexbox位置固定レイアウト
訂正が必要なPenには私からコメントがあります。
自分のPenにコメントがあるかは、それぞれのPen編集画面の左下の「Comments」ボタンから確認できます。
訂正したら「Save」をクリックして保存し、Penを閉じておきましょう。
Webサイトコーディング[LEVEL EASY] その1
Webサイトコーディング[LEVEL EASY]は実用的なレイアウトのコーディングであり、
前回のレイアウトで遊ぼうで行ったようなFlexboxの入れ子などのレイアウト手法も使い、
実際にレイアウトを組む際の具体的な手法などをレクチャーします。
ひとまずVisual Studio Codeを起動しておきましょう。
今回は以下の記事の2ページ目(できれば3ページ目)までの学習を行います。
以下の記事を開いてみましょう。
次回も[LEVEL EASY]のコーディング
今回はここまで。
引き続き次回もWebサイトコーディング[LEVEL EASY]のコーディングを行います。






