2022/09/10

CSS = Cascading Style Sheet
※Cascading:段階的、連鎖的

●同じセレクタに対して同じプロパティ・違う値を指定すると、後から指定した方が有効

●スタイルの継承
→親要素に指定したプロパティが子要素に引き継がれる
※MDNで継承の有無を調べられる
●inheritキーワード
→プロパティの値を親要素から継承する
※値として指定

●検証ツール(Chrome
→調べたい要素を右クリック「検証」
※ctrl shift iでも使用
→ElementsパネルStylesタブにてCSSの確認ができる

●打消線
→text-decorationプロパティline-through
●下線
→text-decorationプロパティunderline
●下線取消し
→text-decorationプロパティnone
※リンクの下線を消す時等

●フォントの変更
→font-familyプロパティ
※値で指定するフォントが表示されるPC内に存在する必要がある
※当該フォントが無い場合の第二・第三候補はカンマで区切って記述
ex)font-family: Verdana, 'Arial black', メイリオ, sans-serif;
※フォント名に空白があればクォーテーションで囲う
CSSに日本語が含まれる(フォント名等)場合、CSSの先頭に「@charset "utf-8";」を記述
※sans-serifはフォント名ではなくフォントのカテゴリ
→前記のフォントが見つからない場合、カテゴリに属するフォントから自動選択されるため必須
・sans-serif:ゴシック体系
・serif:明朝体
cursive:筆記体
・monospace:等幅フォント

●line-heightプロパティ
→行ボックスの高さを指定
※行ボックスの高さ = 文字の高さ(ピクセル)+上下の空白(均等)
●1文字分の高さは1em
→emを指定した箇所のfont-size
●単位無しの場合もem同様
→emあり:記述した箇所のフォントサイズが基準
→emなし:継承先のフォントサイズが基準

●行ボックスのbaseline
→英語記述時の基準線
●vertical-alignプロパティ
→行ボックス内の縦方向の位置指定
→デフォルト値baseline
→topやbottomで行ボックスの端に設定
※画像にmiddleに指定すると、英小文字中央と画像中央が一致する(行ボックス中央ではない)
→px等の長さでは、baselineからどれだけ離れるかを指定