無料オンライン学習Livoo!ホーム > コース紹介 > 【完全無料】CSS講座

HTML、CSS、JavaScript、PHP、DBの総合的な知識を身につけて、未経験から即戦力のプログラマーを目指すHTML講座!
css講座の特徴
cssを短期間で学べる講座です!
Webサイトの見た目を整えよう!CSSを最速で学べる講座です

Webページは、HTMLやCSS、JavaScriptなどさまざまなプログラミング言語を記述して作られています。今ご覧になっているこのWebページもそうです。
CSSはHTMLで記述した文章の論理構造に文字の色やサイズ、ページのレイアウトなどのページの装飾を行うための言語です。HTMLはWebページの骨格で、CSSで肉付けし、見た目を整えていくといったイメージです。
ここでは見た目を整えるためのCSSを学んでいただきます。CSSの習得にはHTMLの知識があることが前提ですので、HTML講座と併せて受講することをおすすめします。

css講座の動画
無料講座に申込む
Web制作のプロの講師によるわかりやすい解説が魅力!
制作現場で求められるスキルやすぐに使える技術をWeb制作の第一線で活躍しているクリエイターが解説!

現在Web制作の第一線で活躍しているクリエイターが基本知識だけでなく、実際の制作現場で求められるノウハウやスキルに即した解説を行うので、すぐに使える技術が身につきます。

動画を見ながら問題を解き、学んだ内容の知識定着を促進!
動画を見直すこともできるので、重要な箇所の見逃しもなく覚えることができます!

動画の右側に表示される問題を解くのは、解説動画を見る前でも見ながらでも見た後でもかまいません。
重要な箇所を問題として出題しているため、もし間違ってもすぐに動画を見直すことで、知識が定着しやすくなります。

総合演習にて身につけた知識をおさらいしながらページを制作し、基本を完璧に理解!
作成したページは添削を行いますので、自分のコーディング力のレベルがわかり、より技術を磨くことができます!

知識を身につけても実際にページが作成できなくては意味がありません。作成したページの添削を行いますので、自分のコーディング力のレベルが分かり、より実力が付いた上で現場で仕事ができるようになります。

無料講座に申込む
カリキュラム
カリキュラムを見る

  • 1 CSSの基本

    • 1-1
      CSSの役割と書き方
    • 1-2
      style属性としてのCSSの指定
    • 1-3
      style要素としてのCSSの指定
    • 1-4
      CSSファイルの作成と指定
  • 2 セレクタ

    • 2-1
      IDセレクタとクラスセレクタ
    • 2-2
      その他のセレクタと詳細度
  • 3 文字と段落

    • 3-1
      フォント
    • 3-2
      色とその指定
    • 3-3
      位置と間隔
  • 4 背景と画像

    • 4-1
      背景の指定
  • 5 罫線と余白

    • 5-1
      罫線
    • 5-2
      罫線の修飾
  • 6 ボックスとレイアウト

    • 6-1
      ボックス
    • 6-2
      回り込みの解除
    • 6-3
      段組み
    • 6-4
      フレキシブルボックス
    • 6-5
      インラインフレームとナビゲーションメニュー
  • 7 変形とアニメーション

    • 7-1
      要素の変形
    • 7-2
      要素の変化
    • 7-3
      アニメーション
  • 8 レスポンシブデザイン

    • 8-1
      レスポンシブデザインとは
    • 8-2
      メディアクエリ
    • 8-3
      レスポンシブデザインの実際
    • 8-4
      グリッドシステム
  • 9 総合演習

    • 9-1
      総合演習
    • 9-2
      模範解答
◎1項10分、標準学習時間 約4時間
1 CSSの基本 1-1 CSSの役割と書き方
1-2 style属性としてのCSSの指定
1-3 style要素としてのCSSの指定
1-4 CSSファイルの作成と指定
2 セレクタ 2-1 IDセレクタとクラスセレクタ
2-2 その他のセレクタと詳細度
3 文字と段落 3-1 フォント
3-2 色とその指定
3-3 位置と間隔
4 背景と画像 4-1 背景の指定
5 罫線と余白 5-1 罫線
5-2 罫線の修飾
6 ボックスと
 レイアウト
6-1 ボックス
6-2 回り込みの解除
6-3 段組み
6-4 フレキシブルボックス
6-5 インラインフレームと
ナビゲーションメニュー
7 変形と
 アニメーション
7-1 要素の変形
7-2 要素の変化
7-3 アニメーション
8 レスポンシブ
 デザイン
8-1 レスポンシブデザインとは
8-2 メディアクエリ
8-3 レスポンシブデザインの実際
8-4 グリッドシステム
9 総合演習 9-1 総合演習
9-2 模範解答
◎1項10分、標準学習時間 約4時間
  • Webサイト制作はまずはここからHTML講座
  • 動的なページの制作が可能になるJavaScript講座
  • PHP初級講座
  • PHP上級講座
  • DB講座
よくある質問
質問

途中で課金になることはありますか?

解答

Livoo!の講座は無料で受講いただけます。
途中で課金されることはございませんのでご安心ください。

質問

動作環境を教えてください。

解答

詳細は、こちらの動作環境詳細ページにまとめておりますので、ご確認くださいませ。

無料講座に申込む