bloggerのcssを追加する

いろいろ書いてく前に、必要そうなcssを追加してく。

• h4
• 装飾のつかないli
• blockquote
• コード貼り付け用のpre

• コード貼り付け用のpre

については
コードをハイライトする「Blogger Syntax Highlighter」ウィジェット
を参照。
あぁそういうウィジットがあるのね。
こんな感じのコードはよく見かける見かける。

スタイルの追加

レイアウト＞htmlの編集を開いて

</b:skin>

の下辺りにcssを突っ込む。

h3

これが表示されてる時点で上は変わってるだろうけどとりあえず

view plainprint?

1. .post-body h4 {  
2.  border-style:solid;  
3.  border-width:0 0 2px 5px;  
4.  border-color:#445566;  
5. }  

.post-body h4 {
 border-style:solid;
 border-width:0 0 2px 5px;
 border-color:#445566;
}

こんな感じか。

装飾のつかないli

view plainprint?

1. .post-body .nols {  
2.  margin:0;  
3.  padding:0;  
4. }  
5. .post-body .nols li {  
6.  margin-left:0px;  
7.  list-style-type: none;  
8. }  

.post-body .nols {
 margin:0;
 padding:0;
}
.post-body .nols li {
 margin-left:0px;
 list-style-type: none;
}

クラス名は nols　で。

blockquote

引用は背景の色付けぐらい

view plainprint?

1. .post-body blockquote {  
2.  background-color:#DDFFEE;  
3. }  

.post-body blockquote {
 background-color:#DDFFEE;
}

h3タイトル

• test1
• test2
• test3

view plainprint?

1. function(){  
2.  var hoge;  
3. }  

function(){
 var hoge;
}

引用する

とりあえずはこんなもんで。

それにしてもクリボウの Blogger Tipsってbloggerのカスタマイズでぐぐると
たいてい引っかかってくるね。
やっぱこれくらいのコンテンツを作んなきゃだめか。
たったこれだけ書くのもめんどいのに…。
むりぽ。