四十前の手習いブログ

最近アイフォンに機種変更をしまして、今更ながらにインターネットの便利さ、重要性に気づきました 四十がそろそろ目前に迫ってきているので、ここらでネットの海に漕ぎ出そうと思いブログSNSを初めます。 始めた事、覚えた事の記録と雑記が中心かと思います。

ブログの見出しをカスタムする ~少しでも見栄えを良くしたい~

見出しを少しかっこよくしよう!

今日も遅くに更新です。

見出しの文字がもう少し華やかになればいいなと思い、「はてなブログ 見出し文字」で検索してみるとたくさんの説明が出てきました。みんな通る道の様だ。

 さてやり方はと…

f:id:kenny_kenny:20160317005514j:plain

 

ダッシュボードの左側の黒い部分のメニューのデザインを選び、

 

f:id:kenny_kenny:20160317005630j:plain

 

左上のアイコン「パレット・スパナ・スマホ」のアイコンのうち「スパナ」をクリック

一番下のデザインCSSをクリックしウィンドウを表示させる。ここにCSS書き込めばカスタムできるようです。

 

見出しをカスタムするための、cssはたくさん紹介されているので、コピペさせていただきました。

 

.entry-content h3{ border-bottom: 3px solid #d7605e; font-size: 20px; margin-top: 15px; margin-bottom: 10px; }

コピペでOK!CSSのみで見出しをおしゃれにする方法10選【はてなブログカスタマイズ対応】 - North-Geek

 に実験として、背景色と、下線の色変更、文字サイズを大きくしてみました

.entry-content h3{
    font-size: 28px;
 color: #3f3f3f;
 padding: 10px 15px;
 border-bottom: 3px solid #228b22;
 background-color: #eee;
}

あれっ???かわらない???

変わっているところもある??

明日の仕事に差し支えるので、とりあえずここまで・・・と思ったら、見たまま編集のページだとCSSが反映していませんでした。プレビューしたら見出しに下線がついていました!

 

他にもいろいろできるようなので、色々なページを見て勉強します!

1日一つでも手を加えて、ブログを更新できれば大したものですね。

まずは見出し、がんばろー。オー。

参考サイト

いつも色々なところにお世話になっています。

いつか恩返しができる日が来るように頑張ります。

www.colordic.org

 

mudaide.hatenablog.com