2008年08月29日
記事欄にバック画像を追加!
ブログを開設したもののHTMLタグについては全く無知!!
今までいろいろなページを参考させて頂き変更してきました。
ありがとうございました
そのおかげもあり、眺めているうちに、なんとなく理解できてきた!
普段はあまり頭を使うことが無いのだが、こういうときはチョットは働くのだ~
そこでちょっと待てよ!
せっかくいろいろなテンプレートがあるんだから比べれみれば違いがわかるんじゃないか??
という事で、初の自力いじり。
今回は記事の右下にオリジナルの画像を入れてみました。
変更方法は ↓
① お気に入りの写真をPixia(フリーソフト)で編集!!
ちなみに我が家は300×150pxサイズで作成しました。

② 画像をUPします。
③ テンプレートのカスタマイズに入り、スタイルシートを下の様に変更します。
*我が家はもともと湖のテンプレートをつかってます。
元のテンプレートにより違うので注意してくださいね。
ちなみに /* */ でくくるとコメントになりますので解った箇所はコメントでメモしてます。
【変更前】=============================
/* ★各記事の欄 */
.blogbody{ ←このカッコ内がブログ記事ランの設定らしい
background :#fff; /* ★各記事のバックの色 #fff=白*/
margin :0px 0px 10px 0px;
padding :8px;
border-left :1px none #0000CC;
border-right :1px none #0000CC;
border-bottom :1px solid #917058;
border-top :1px none #0000CC;
} この設定では記事欄は真白です。
【変更後】=============================
.blogbody{ ←このカッコ内がブログ記事ランの設定らしい
background :#fff url(ここに画像のURLを張り付ける); ←②の画像のURL
background-repeat:no-repeat;
background-position:bottom right; ←記事の右下に表示する
margin :0px 0px 10px 0px;
padding :8px;
border-left :1px none #0000CC;
border-right :1px none #0000CC;
border-bottom :1px solid #917058;
border-top :1px none #0000CC;
}
*赤字の箇所を追加
=================================
以上で変更は終わりです。
が、、、
コメント欄がかぶってて、肝心の画像が見えな~イ!!
ガ~ン
コメント欄を透明にできないのかな~
しばらくは悪戦苦闘が続きそうです
◇◇◇◇◇◇◇◇◇◇◇◇◇◇
ポチッと応援お願いします
今までいろいろなページを参考させて頂き変更してきました。
ありがとうございました

そのおかげもあり、眺めているうちに、なんとなく理解できてきた!
普段はあまり頭を使うことが無いのだが、こういうときはチョットは働くのだ~

そこでちょっと待てよ!
せっかくいろいろなテンプレートがあるんだから比べれみれば違いがわかるんじゃないか??
という事で、初の自力いじり。
今回は記事の右下にオリジナルの画像を入れてみました。
変更方法は ↓
① お気に入りの写真をPixia(フリーソフト)で編集!!
ちなみに我が家は300×150pxサイズで作成しました。

② 画像をUPします。
③ テンプレートのカスタマイズに入り、スタイルシートを下の様に変更します。
*我が家はもともと湖のテンプレートをつかってます。
元のテンプレートにより違うので注意してくださいね。
ちなみに /* */ でくくるとコメントになりますので解った箇所はコメントでメモしてます。
【変更前】=============================
/* ★各記事の欄 */
.blogbody{ ←このカッコ内がブログ記事ランの設定らしい
background :#fff; /* ★各記事のバックの色 #fff=白*/
margin :0px 0px 10px 0px;
padding :8px;
border-left :1px none #0000CC;
border-right :1px none #0000CC;
border-bottom :1px solid #917058;
border-top :1px none #0000CC;
} この設定では記事欄は真白です。
【変更後】=============================
.blogbody{ ←このカッコ内がブログ記事ランの設定らしい
background :#fff url(ここに画像のURLを張り付ける); ←②の画像のURL
background-repeat:no-repeat;
background-position:bottom right; ←記事の右下に表示する
margin :0px 0px 10px 0px;
padding :8px;
border-left :1px none #0000CC;
border-right :1px none #0000CC;
border-bottom :1px solid #917058;
border-top :1px none #0000CC;
}
*赤字の箇所を追加
=================================
以上で変更は終わりです。
が、、、
コメント欄がかぶってて、肝心の画像が見えな~イ!!
ガ~ン
コメント欄を透明にできないのかな~
しばらくは悪戦苦闘が続きそうです

◇◇◇◇◇◇◇◇◇◇◇◇◇◇
ポチッと応援お願いします






















Posted by マツテック at 20:50│Comments(2)
│テンプレート
この記事へのコメント
こんばんわ^^
HTMLタグはほんと難しいですね・・・いまだちんぷんかんぷんです(u_u)
僕も予備のテンプレートで他のブログとか参考にしていろいろやってみたりしてますが、途中で訳ワカラン様になり最近放置してますが・・・
ふむふむ・・・今回はいいお勉強になりました(u_u)再開再開っと^^
HTMLタグはほんと難しいですね・・・いまだちんぷんかんぷんです(u_u)
僕も予備のテンプレートで他のブログとか参考にしていろいろやってみたりしてますが、途中で訳ワカラン様になり最近放置してますが・・・
ふむふむ・・・今回はいいお勉強になりました(u_u)再開再開っと^^
Posted by おいやん
at 2008年08月30日 01:25

おいやんさん こんにちは。
記事にUPしたものの、細かいことを質問されても非常に困る状態なんですが...
せっかくなので、この際勉強してみようかな~と思ってますが、いつまで続くやら^^
記事にUPしたものの、細かいことを質問されても非常に困る状態なんですが...
せっかくなので、この際勉強してみようかな~と思ってますが、いつまで続くやら^^
Posted by マツテック
at 2008年08月30日 14:57
