【HTML/CSS】Spotify風簡易音楽サイトを作ろう!

【初級レベル/9時間】HTMLとCSSを使ってWEBサイトページを制作しよう!

学習内容

  • CSSで行う要素の「配置」を短いコードで柔軟に行えるFlexBoxについて学びます。
  • CDNを利用したSwiperの導入方法を学びます。
  • Swiperを使ったスライダーの実装を行います。
  • transition を使って色変化効果を用いたボタンを実装します。
  • Font Awesomeを使ったアイコンの設定方法を学びます。


受講における必要条件

  • HTML/CSSの基礎知識

HTML/CSSを一度も触ったことがない方は、まずはProgate等で学習することをおすすめします。


教材内容

本教材では、HTML・CSSの基礎を少し学んだが、デザインを工夫したサイトを作成したい方向けへの教材となっています。 参考のサイトは、「Spotify」という音楽配信サービスとなり、そのサイトのトップページのデザインに寄せたページを作成していくものとなります。

完成イメージはこちらになります。
完成イメージのGIF画像


この教材の対象者

  • HTML/CSSの初歩的なことは学んでいてもう少しステップアップしたい方
  • 手を動かしてHTML/CSSを学びたい方


本教材で質問対応可能なOSや環境

  • Mac OS
  • Windows

本教材ではBrackets を使っているので、MacでもWindowsでも質問対応可能です。


本教材はテキストで構成されており、自分のペースで学習を進めることができます。

この教材の執筆者


KAI
KAI

Web系のエンジニアをしています。PHP言語が得意です。某クラウドソーシングサービスにて年間の受賞候補者にノミネートされた経験があります。日々精進して行きます。


本教材のカリキュラム



今すぐはじめる!