記事欄にバック画像を追加！

ブログを開設したもののＨＴＭＬタグについては全く無知！！

今までいろいろなページを参考させて頂き変更してきました。
　　　ありがとうございました

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

そこでちょっと待てよ！
せっかくいろいろなテンプレートがあるんだから比べれみれば違いがわかるんじゃないか？？

という事で、初の自力いじり。

今回は記事の右下にオリジナルの画像を入れてみました。


変更方法は　↓

①　お気に入りの写真をＰｉｘｉａ（フリーソフト）で編集！！
　　ちなみに我が家は３００×１５０ｐｘサイズで作成しました。
　　　

②　画像をＵＰします。

③　テンプレートのカスタマイズに入り、スタイルシートを下の様に変更します。
　　　＊我が家はもともと湖のテンプレートをつかってます。
　　　　　元のテンプレートにより違うので注意してくださいね。
　　　　　ちなみに　/*　　*/　でくくるとコメントになりますので解った箇所はコメントでメモしてます。

　　【変更前】＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

　　/* ★各記事の欄 */
　　.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;
　　}
　　　　　　　　　　　　　　　　　　　　　　＊赤字の箇所を追加
　　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

以上で変更は終わりです。

が、、、
コメント欄がかぶってて、肝心の画像が見えな～イ！！
　　　　　　　ガ～ン
コメント欄を透明にできないのかな～

しばらくは悪戦苦闘が続きそうです

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

あなたにおススメの記事