【旧版】CSS入門
Webページのスタイルを設定できるCSSの基礎を学習
お知らせ：旧版のコースのためメンテナンス及びサポートを終了しています。
合計時間：01:03:25
学習内容
Webページのスタイルを設定できるCSSの基礎を学習します。
レクチャー一覧
- CSS入門
-
1. CSS入門セクション以降のテキストエディタについて4分Google ChromeとAtomのインストールを説明します。
- 利用するテキストエディタについて
- Atomダウンロードサイト
- インストール方法について
-
2. イントロダクション
このセクションでは、CSSの基礎について学習します。
-
3. CSS基礎2分CSSとはなにかについて説明します。
- CSSの概要
- HTMLとCSSの役割
- CSSのルール
-
4. はじめてのCSS_110分基本的なCSSの記述を行います。
- CSSのインライン記述
- CSSの内部参照
- CSSの外部参照
-
5. はじめてのCSS_25分CSSを記述する際の特徴について説明します。
- CSS外部参照のメリット
- 特定のページのスタイルの変え方
- CSSの組み込み方の優先順位
-
6. HTMLテンプレート配布HTMLの新たなテンプレートの配布です。
- 新しいテンプレート
- linkタグ
- レクチャーのリソース
-
7. CSSコメント3分コメントについて説明します。
- コメントとは？
- コメントの記述方法
- 複数行のコメント
-
8. color7分CSSのcolorプロパティについて説明します。
- 色の指定方法について
- RGBでの指定方法
- カラー名での指定方法
-
9. 背景とボーダー16分背景とボーダーについて説明します。
- background-colorについて
- border-colorについて
- border-styleについて補足
-
10. 背景とボーダー23分背景とボーダーについて説明します。
- 背景に画像を設定
- 背景画像の繰り返し(background-repeat)
- 背景画像の位置(background-position)
-
11. セレクター8分セレクターについて説明します。
- セレクターとは？
- セレクターの種類
- 各セレクターの書き方
-
12. 演習_CSS基礎1分これまで学習した基本的なCSSを使った演習です。
- 目標物の確認
- 添付ファイルの説明
- 演習の準備
-
13. 演習回答_CSS基礎5分これまで学習した基本的なCSSを使った演習の回答です。
- 各部分の記述
- 完成物との比較
-
14. chrome_developper_tool7分Google Chromeデベロッパーツールについて説明します。
- Google Chromeデベロッパーツールとは？
- デベロッパールールでできることの実践
- デベロッパーツール上でのコードの変更