ただし(仮)のメモ

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

CSSのお勉強(文字色、背景色の指定)

文字色,背景色の指定方法

.pageTitle {
    color: #333333;
    background-color: #F2F2E5;
}

文字色はcolorで指定。
背景色はbackground-colorで指定。
色は#(シャープ)と6桁の数字で16進数で表す。
最初の二桁が赤、次の二桁が緑、最後の二桁が青を表す(RGBの順)。
実際に色を選ぶ際はpixlrなどのツールを使う。

文字色の標準は黒だがグレーなどに変えると見る人に柔らかい印象を与えるそうです。
ちなみにVSCodeだとカラーコードを記述するとその横に色が表示されます。便利!

最近の体調

ブログを1日1更新するのはなかなか大変。
私は体調の良い期間と悪い期間の差が結構激しく、最近は悪い期間なので1日3/4くらいはベッドで寝転がって過ごしてたりします。
なので勉強もはかどらないしブログのネタも書く気力もあまりない。
じゃあ書かずにダラダラしてたほうがいいんじゃないのと思うが、そうすると今度は私はなんのために生きているんだろうとか思ってまた体調が悪くなったりする。
どうしようもないな(笑)

ハロプロ映像作品まとめ(鑑賞済み)

モーニング娘。
作品名 撮影日 内容 評価
MORNING DAYS 10 11/11/13 田中れいなファンクラブツアーin福岡 ☆☆☆
鈴木香音バースデーイベント2013 13/08/05 モノボケ,モノマネ,Live,生田,佐藤 ☆☆☆
飯窪春菜バースデーイベント2013 13/11/07 似顔絵,歌,ダンス,Live,コスプレ,石田,小田 ☆☆
佐藤優樹バースデーイベント2014 14/05/07 目標,電話相談,Live,セクシー発言,工藤 ☆☆
飯窪春菜バースデーイベント2014 14/11/07 倍速ダンス,飯窪親,Live,ママの手紙(感動) ☆☆☆
佐藤優樹バースデーイベント2015 15/05/07 電話相談,Live,上々鈴木,こにわ ☆☆☆
鈴木香音バースデーイベント2015 15/08/05 目標,メンバー質問,Live,上々鈴木 ☆☆
佐藤優樹バースデーDVD2016 16/04/29 目標,テーマ話,夢の絵,ゲーム,自撮り
佐藤優樹バースデーイベント2016 16/05/20 伝説,質問,Live,風船に入る,上々鈴木 ☆☆☆
℃-ute
作品名 撮影日 内容 評価
DVD MAGAZINE vol.60 16/04/02 ℃-uteがマジックショー&練習 ☆☆☆☆

※撮影日不明の場合は発売日
表はグーグルスプレッドシートで作成。

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以下は見づらい

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