Chapter 21

第六回「HTML/CSS講座::再び基礎から」(6.9up!)

shiozumi
shiozumi
2022.06.09に更新

カリキュラム概要

ここまで、基礎的な事を、ちょっと飛ばして伝えてきた感じもありますので、引き続き基本に戻って学習して行きましょう!

HTMLの基本構造!

https://blog.codecamp.jp/html_basic

動画解説その1

https://youtu.be/Ti5mze-zpKQ

特殊文字の復習

https://blog.codecamp.jp/html_charcter

動画解説その2

https://youtu.be/664tIWmlquQ

CSSの超入門

https://saruwakakun.com/html-css/basic/css
// HTMLファイル内に、STYLEタグで直接書き込む
<STYLE>
h1 {
  font-size: 10px;
}
</STYLE>

// 個々のタグの中で、style属性で記述する
<h1 style="font-size: 10px">

// CSSファイルを作成して、別記する。
h1 {
  font-size: 10px;
}

動画解説その3(Styleタグ指定)

https://youtu.be/7RyVZzE_3XE

セレクターの指定方法

動画解説その4(セレクター:id,class)

https://youtu.be/Aexq7EapqFc

動画解説その5(セレクター:子孫)

https://youtu.be/fca6pRO81G0

フォントサイズの設定(px,em)

指定方法 解説 補足
px 絶対値 最終的なフォントのサイズで設定 最終値なので、常に固定で変わらず、他の影響は受けない。
em 相対値 何かの値を基準とした倍率で設定 基準となるフォントの大きさスを変えれば、それを元に値が変わる。

参考サイト!

https://www.attend.jp/desine_170220#:~:text=em(エム),基準とした単位です。&text=emは使われて,30pxに変化します。

動画解説その6(セレクター:優先順位)

https://youtu.be/2aiYwsN5gOM

セレクターの優先順位

https://web-designer.cman.jp/css_ref/css_base/order/

まとめ

それにしても、学習量が膨大に膨れてしまいましたね。まずは、ここまで学んだスキルで、各自いろいろHTML/CSSを作っては、デバッグしてみましょう! (o^―^o)ニコ