2017年05月18日

(6)個別記事タイトルの背景色を変える/サイドバーのタイトルを装飾する


 f-f_object_173-s512_f_object_173_0nbg.png   
使用デザイン
 Seesaaブログのライトグレー(両サイドバー)


個別記事タイトルの背景色を変える

Seesaaブログのこのテンプレートは、h1(ブログタイトル)、h2(年月日)、h3(個別記事タイトル)になっているので、h3に対して背景色の指定しました。

スタイルシートの一番下に以下の記述を追加。

h3 {
background-color:#afeeee;
}



サイドバータイトルを装飾する

スタイルシートの一番下に以下の記述を追加。

.sidetitle {
height: 20px;
line-height:20px;
color: #000000;
background-color: #afeeee;
border-radius: 3px;
margin-bottom:10px;
margin-top:10px;
padding: 5px;
text-align:center;
}



color: #000000; →文字の色をblack(黒)に
background-color: #afeeee;→背景色をpaleturquoise(薄い水色)に
border-radius: 3px; →角に丸み
text-align:center;→文字をセンター位置


完成
カスタマイズ記事見出しほか02.jpg


スポンサーリンク


ちなみにカラーを指定するときの色見本帳は
原色大辞典を参考にしています! シンプルで分かりやすいです^^

 
posted by スピカ at 01:00| シーサーブログのカスタマイズ | 更新情報をチェックする