ただし(仮)のメモ

平塚在住,無職,うつ病,孤独

CSSのお勉強(CSSの基礎、文字サイズ指定)

テーマを変えました

なんということでしょう!
最近HTMLやCSSの勉強をして、ブログの見た目をカスタマイズしよ~なんて思っていたらカスタムテーマなどという便利なものがあるのですね!
そもそもテーマ変更すらよく分かっていなかったんですけど、テーマを変更するだけで見出しタグなどもテーマにあったものに変更されるしHTML/CSSなんて勉強する必要なかったんや!w

しかしせっかく勉強したんだから自分でカスタマイズしたいよなと思ったのでシンプルそうなBlankを選択。
ちなみにDUDEという既に整っているテーマもあったので自分でのカスタマイズがイマイチなら乗り換えるかも…w

CSSの記述ルール

p { font-size: 14px; }
.example { font-size: 14px; }
p.example { font-size: 14px; }
#example { font-size: 14px; }

上から順に、タグ、クラス、タグ内のクラス、idに対して適応する方法です。
idは一つのHTMLページに対して1回しか使えないクラスみたいなもの(多分)。

CSSの適用方法

<!-- CSSを外部ファイル化する方法 -->
<head>
    <link rel="stylesheet" href="cssファイルのパス">
</head>

<!-- head要素内に記述 -->
<head>
    <style>
        p { font-size: 14px; }
    </style>
</head>

<!-- インラインでstyle属性を記述 -->
<p style="font-size: 14px;">コンテンツ</p>

外部ファイル化する方法が一番オススメだそうです。

文字サイズ指定

p { font-size: 14px; }

上記のように書けばOK。
右側の単位はpx以外にも色々あるみたいです。

サイズ設定の目安は

  • <p>タグのブラウザ標準は16px
  • 平均は13px~16px程度
  • 10px以下は見づらい

以上を参考にするとよさそうです。