タイトルの装飾を変更

ちょっとは見た目に変化のある変更をしてみたかったので、とりあえず各タイトル部の装飾をいじってみました。
今回の変更したセレクタは以下の5箇所

.blogbody
.title
.date
.sidetitle
.calendarhead

基本的には、それぞれのラインを消すか変更しただけです。それに伴って間隔を調整したくらい。どちらにしても劇的な変更と言うほどではない。
それで良いんです。勉強のためにやってるのだから一つ一つこつこつと手を加えては確認してを繰り返していきたいと思います。


まずは記事の日付とタイトルのラインを消します。

.date{
clear:left;
color:#000;
margin-top:0px;
margin-bottom:0px;
padding:5px;
border-left:5px solid #000; ・・・・ここを削除
}
.title{
font-weight:bold;
padding:5px;
margin:0px;
border-top:1px solid #000;  ・・・・ここを削除
border-bottom:1px solid #000; ・・・・ここを削除
}
.title a{
border:none;
}

これだけだと記事と記事の間隔が近すぎてわかりづらいので間隔を広げます。

.blogbody {
font-weight:normal;
line-height:120%;
margin-bottom:15px;  ・・・・ここを30pxに変更
}

これで記事本体は完了。
次にサイドバーのコンテンツタイトルのラインを変更しました。

.calendarhead {
color:#333;
font-size:90%;
font-weight:bold;
text-align:center;
padding:3px;  ・・・・ここを2pxへ変更
border:1px solid #333; ・・・・ここをborder-bottom:1px solid #888888;へ変更
}

.sidetitle {
font-size:90%;
font-weight:normal;
padding:5px;  ・・・・ここを2pxへ変更
margin-top:10px;  ・・・・ここを15pxへ変更
font-weight:bold;
width:100%;
text-align:center;
color:#333;
border:1px solid #333; ・・・・ここをborder-bottom:1px solid #888888;へ変更
}

paddinngとmargin-topを変更しているのは、やはり間隔が悪くて分かり難いため調整しました。
今回の変更はここまでです。多少でも見た目が変わるとやった甲斐があると言う気になりますね。次は少し色を付けてみたいかなぁ。