【コーディング課題 〜中級編〜】解説記事

この記事では、コーディング課題(中級編)の解説をしていきます!

解説は動画内で行っています!

コードだけ見たい方はサンプルコードをダウンロードしてください。

コーディング課題(初級編)をご覧になってない方はこちらの記事で確認してください☆

TOPページのHTML

まずは制作物の確認とファイルの準備をして、TOPページのHTMLを記述していきましょう!

TOPページのCSS

HTMLを書いたら、CSSを書いていきます。カンプのデザインを見ながら、コードに反映していきましょう!

TOPページのレスポンシブ

PC版のCSSを記述したら、メディアクエリを書いてレスポンシブの記述をしていきます。検証ツールを使用しながら画面幅を変えてやっていきましょう。

TOPページのjQuery

jQueryを使用して、スティッキーヘッダー、スライドショー、ハンバーガーメニューを実装します。

コンタクトページのCSS

コンタクトフォームのコーディングは難しいですが、数をこなしてなれていきましょう!

おつかれさまでした!!

お忙しい中、コーディング実施してくださったみなさまありがとうございました🙇‍♂️

 コーディングやデザインカンプにミスがあったら申し訳ありません😭

 少しでも皆さんの学習のお役に立てるよう、今後も無料でコンテンツをガンガンリリースしていきます!!応援よろしくお願いします🙇‍♂️

この記事がいいと思ってくださった方は、SNSでのシェアをお願いします![addthis tool="addthis_inline_share_toolbox_mqi1"]

今回使ったコードは、忘れずにスニペット登録しておきましょうね✨

質問をTwitterから募集します!

無料でwebデザインに関する質問にお答えします。

クリ★スタは未経験からwebデザイナーを目指す方を応援しています!そのため、学習していく中での些細な疑問に記事で回答していきます。

お気軽にご連絡ください。→クリ★スタ(@cresta_design)

この記事がいいと思ってくださった方は、SNSでのシェアをお願いします![addthis tool="addthis_inline_share_toolbox_mqi1"]

Youtubeでは動画学習コンテンツを配信しています!

 動画での学習は、テキストでの学習の3倍以上の効果を得られると言われています。そのため、クリスタでは、初学者の方に効果的な学習をして頂くためにYoutubeで学習コンテンツを提供しています。

 ぜひチャンネル登録お願いします→クリ★スタYoutubeチャンネル

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA