100日後にWebエンジニアになるおじさん～9日目～

学んだこと

・フォントサイズ
・フォントファミリー

フォントサイズ

テキストのフォントサイズを調整するプロパティ。値の指定方法にはたくさんの種類があるが、今回はpx（ピクセル）を学んだ。pxは絶対単位で、HTML内のどこで使用しても文字の大きさは変わらない。
例：{font-size:100px;}
セレクターのサイズを100pxに指定する。

フォントファミリー

font-family は、テキストのフォントを指定するプロパティのこと。値には、使用したいフォントの名前を指定する。ただし、閲覧する環境によっては指定したフォントが対応していない場合があり、その場合はブラウザのデフォルトフォントが適用される。
これを回避するために、フォント名をカンマで区切って複数指定すると、上から順に利用可能なフォントが適用される。また、総称ファミリー（generic family）を指定すると、指定したフォントが使えない場合でも、同じカテゴリのフォントが適用されるため、ある程度デザインをコントロールできる。

例：font-family: "Arial", "Helvetica", sans-serif;
この場合Arial→Helvetica→sans-serif系のフォントが順に適応される。

h1{
    font-weight:100;
    font-family: monospace;
    text-align: center;
    font-size: 40px;
    text-decoration: underline wavy plum;
    letter-spacing: 20px;
    text-transform: uppercase;
}

※コードは公開できるけどそれによって反映されたHTMLは表示できない…
やり方を調べてみよう

セレクターについて

使用できるセレクターについて。今まではタグを指定するやり方だったが、セレクターには便利な指定方法が複数存在する。

・ユニバーサルセレクター「＊」
HTML内のすべてが対象。

・IDセレクター「＃」
指定したIDが対象。例えばsignupというidを指定したい場合は次のように記載する。
#signup{property:value;}
注意点としてidは一つのHTMLで1回しか使用できない。