本講座について

受講に必要なスキルなど

本講座では、CSSフレームワーク『Tailwind CSS』を使用したコーディング方法を学習していただきます。

学習にはHTML+CSSを使った基本的なWebコーディングが出来る環境・基礎知識が必要です。
具体的には以下の項目となります。

必要な作業環境

  • HTMLを書けるエディタ
  • Webブラウザ(解説ではGoogle Chrome使用)

受講に必要なスキル

  • 基本的なコーディングが分かる(HTMLとCSSの基礎知識)
  • メディアクエリとブレイクポイントの理解
  • ブラウザの検証ツールで、要素に適用されているスタイルが確認できる

HTMLコーティングをしたがことがない、検証ツールって何?という場合は、先に下記講座をご受講ください。

本講座の進め方とゴール

本講座では、Tailwind CSSの使い方を、Webページのコーディングを進めながら解説しています。
解説と一緒にコーディングしていただくと効率よく学習を進めて頂くことが可能です。

最終的には、以下のようなWebページのコーディングを完成させますよ。

使用画像について

画像は、以下のUnsplashのフリー画像を使用させていただいています。
リンク先からダウンロードするか、お手持ちの(お好きな)画像を使用してください。

素材

URL:https://unsplash.com/ja/%E5%86%99%E7%9C%9F/dcNHyPAVD8E

推奨サイズ:L(2400 × 1502)

URL:https://unsplash.com/ja/%E5%86%99%E7%9C%9F/p6KMIFzWwy8

推奨サイズ:中間(1920 × 1280)

URL:https://unsplash.com/ja/%E5%86%99%E7%9C%9F/fhuPrCwAzaw

推奨サイズ:中間(1920 × 1439)

提出・ご質問の注意点

解説と一緒にコーディングを進められたHTMLファイルの提出は不要です。
上手く行かないなど、ご質問時にのみファイルを添付してください。

講座で触れられていないユーティリティ等を使用したコーディングのご質問に対しましては、アドバイスベースでの返信とさせていだく場合があります。あらかじめご了承ください。

無料ビデオ講座のお知らせ

Skillhub [スキルハブ]では無料の動画講座を多数公開しています。他校だと数万円するような講座が無料で受講できます。

無料講座一覧を見る

×