今日のワーク

はじめてのCSS

#01 はじめてのCSSを書いてみよう (02:54)
styleタグ
セレクタ、プロパティ
CSSファイルの作成、読み込み

#02 デベロッパーツールを使ってみよう (02:37)
デベロッパーツールの起動
Elmentsパネル
HTML/CSSの確認
Styles/Computedタブ

#03 色の表現方法を学ぼう (02:52)
色キーワード
rgb()
16進数による表現

https://dotinstall.com/lessons/basic_css_v4

補足動画

生徒さんが躓きやすかったポイントやわかりにくい部分を補足しております。全て理解できた場合でも参考になるものもあると思うので見てみてください。

#1
<link rel="stylesheet" href="css/styles.css">こういう文章を完全暗記する必要はなし。

htmlとcssファイルを分ける理由。

atomの画面分割の方法

#2

ディベロッパーツールの画面が変な時の対応法

#3

Webカラーは暗記する必要なしです。以下のようなサイトから色を見つけていきます。

https://www.colordic.org/