ブログをカスタマイズしてみる①
少しだけ、ブログの概観?を変えてみた。
かなり、ぐだぐだとした長い記事です。
個人的に記事の背景とメイン部分の背景色が一緒って
なんか見難い気がしたので・・・。
テンプレートを使ってても、幸ちゃんやミュウ君との思い出を
少しでも綺麗な形で残しておきたくて。
デザインには少しこだわってみようと思います。
では、さっそくTRY!
主に、こういう部分の書式はCSSで変更できるらしい。
仕事柄CSSとかHTMLは切り貼り程度でなら
使うことが出来るので、いつも使ってる勉強サイトと
仕事で使ったときのソースを確認しながら、
以下のことをやってみた。
①記事の背景色を変える
②記事に囲いをつける
③フッターの設定をする
記事の背景色を変える
メインはコレ。一番やりたかったこと。
うまく説明できないけど、要は、表示されているパーツ毎に
色々設定できるようになっているが、
『このパーツ(名前)』の背景色を変えたいんだよー!
って言うのを、どうやったら理解してもらえるのかと…。
そこが分からなかったので、
自分のブログのソースを見て、<div>で囲まれてる部分を探して
パーツの名前を確認しました。
どうやら、記事に関するパーツの名前?は
『 id="main-inner" 』って言うらしい。
なので、CSSの部分にコレを書き足してみた。
background-color: #e6e6fa;
}
背景をこの色(#e6e6fa)にする。
すると…見事、色が変わってくれたのだが…。
新たな問題に直面することになる。
問題点① カテゴリーやページャの背景と同化して見辛くなる。
⇒色選びのセンスの無さが仇に…。orz
でも、何とか落ち着いた。
問題点② 記事ページの余白が狭い。
⇒これもCSSで解決。
background-color: #e6e6fa;
padding: 10px 20px 5px 20px;
}
左から、上、右、下、左の余白を設定できるらしい。
今日はここで力尽きたので、
次回は
記事に囲いをつける
方法を、第二弾として更新予定。
備忘録もかねた記事ですが、お楽しみに~。