多忙なため、コメントへのお返しができなくてごめんなさい。温かいコメントは更新の励みです。どうしても解決できない問題がある...という場合に限っての質問箱を設けましたので、よかったらご利用ください。いつもAnimal Skinを愛用してくださってどうもありがとう~♪
Top
「キャンバスのスキン」配布 「Canvas」 by Animal Skin
f0165338_17215893.jpg

プレビューはここをクリック


ちょっと渋めで、ちょっと可愛いスキンを目指してみました。
え? 「渋い」って、死語?! ^^;

デフォルトの小鳥モチーフに、入れ替えオプションをつけました。
→猫
http://pds.exblog.jp/pds/1/201003%2F12%2F38%2Ff0165338_1739061.jpg
→お花
http://pds.exblog.jp/pds/1/201003%2F12%2F38%2Ff0165338_17384827.jpg
→肉球
http://pds.exblog.jp/pds/1/201003%2F12%2F38%2Ff0165338_1822957.jpg

これらのどれかと入れ替えてもヨシ、また、これらを参考にオリジナルのイラストと入れ替えでもヨシ♪
入れ替え場所は、この文章の後に続くソースコードの中、CSS編集内に示してあります。



■「メイン」■ 枠の中をすべてコピーしてHTML編集の「メイン」部分に貼ってください。

<a name=pt></a>
<CENTER>
<DIV ID=BODY>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 ALIGN=CENTER WIDTH=740>
<TR><TD VALIGN=TOP WIDTH=740 height=80 align=center>
<DIV ID=TOP>
<DIV CLASS=HEADER><$header$></DIV>
<DIV CLASS=URL><$blogurl$></DIV>
</DIV>
</TD></TR>
<TR><TD VALIGN=TOP WIDTH=740 height=20 align=center>
<DIV ID=TOP2>
</DIV>
</TD></TR>
</TABLE>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=740>
<TR><TD VALIGN=TOP WIDTH=190>
<DIV ID=LEFT>
<DIV CLASS=USERMENU_LINK><$adminmenu type=2$></DIV>
<DIV CLASS=PROFILE>
<CENTER><$logoimage type=1$></CENTER>
<$description$><$nick$>
</DIV>
<$calendar type=1$>
<DIV CLASS=MN><$menuleft$></DIV>
<CENTER><$banner type=1$>
</CENTER>
<$xml$>
<CENTER>
<font size="1">
"Canvas" Skin by <br>
<a href="http://animalskin.exblog.jp/" target="_blank"><b>Animal Skin</b></a></div></a></font></CENTER>
</DIV>
</TD>
<TD VALIGN=TOP WIDTH=550>
<DIV ID=RIGHT>
<$post$>
<table border="0" cellpadding="0" cellspacing="0" width="70%" align="center">
<tr><td align="right" width="35%"><$prepage type=1$></td>
<td align="center" width="30%"><a href="#top" target="_self"> | ページトップ | </a></td>
<td align="left" width="35%"><$nextpage type=1$></td></tr>
</table>
</DIV>
</TD></TR></TABLE>
</DIV>
</CENTER>



■「本文」■ 枠の中をすべてコピーしてHTML編集の「本文」部分に貼ってください。

<DIV CLASS=POST>
<DIV CLASS=POST_HEAD>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD WIDTH=550>
<DIV CLASS=POST_TTL><$postsubject$></DIV>
</TD></TR>
</TABLE>
</DIV>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 ALIGN=center WIDTH=500><TR>
<TD WIDTH=400 ></td>
<td width=100 VALIGN=TOP Align=RIGHT><$postadmin type=2$></td></tr></table>
<DIV CLASS=POST_BODY>
<$postcont$>
</DIV><div class="POST_TAIL" align="right"><a href=#pt>Top▲</a> | <$posttail$></DIV>
<$cmtjs$>
</DIV>



■メニュー■ (一応「メニュー」部分へのコードを貼っておきますが、ここはもともと書いてあるコードでOKです。つまりここは無視しちゃってOK!)

<div class="MNTTL"><$mntitle$></div>
<$mnbody$>




■CSS編集■ 枠の中をすべてコピーして「CSS編集」部分に貼ってください。

/* Canvas Skin by Animal Skin*/

/* 固定背景を解除したい人は、↓この中のbackground-attachment: fixed;というのを消しちゃってね*/
BODY{ BACKGROUND-IMAGE : URL(http://pds.exblog.jp/pds/1/201003%2F11%2F38%2Ff0165338_1511028.jpg); background-attachment: fixed;MARGIN : 0;PADDING : 0; }
BODY,TD,DIV,LI{ FONT-SIZE : SMALL; FONT-FAMILY : VERDANA,ARIAL,SANS-SERIF; LINE-HEIGHT : 150%; COLOR : #514c40; WORD-BREAK : BREAK-ALL; }

A:LINK{ COLOR: #a2987e; TEXT-DECORATION: NONE }
A:VISITED{ COLOR: #a2987e; TEXT-DECORATION: NONE }
A:ACTIVE{ COLOR: #a2987e; }
A:HOVER{ COLOR: #514c40; }


/*↓のURLはデフォルトで使っている小鳥のモチーフです。
オプションとして配布しているモチーフと入れ替えたい場合は、先に表示したURLをコピーして、
↓の枠内のbackground-imageに続くURLと入れ替えてください。

モチーフの場所を変えないまま、自分のオリジナルの画像を入れる場合はサイズに気をつけて。
参考までに、デフォルトの小鳥の画像は、白背景も含め、大きさは203×192です。*/
DIV#BODY {BACKGROUND : #FFF;WIDTH : 740PX;
background-image: url("http://pds.exblog.jp/pds/1/201003/11/38/piyo2.jpg" ); background-repeat : no-repeat; background-position :RIGHT top;
TEXT-ALIGN : LEFT;}

DIV#TOP {
PADDING : 40PX 0PX 0PX;
WIDTH : 741PX;}

DIV#TOP2 {
BORDER-BOTTOM : 1PX solid #bcb297;
PADDING : 0PX 0PX 25PX;
WIDTH : 720PX;}

DIV#LEFT {
MARGIN : 10PX 0PX 50PX 10PX;
PADDING-RIGHT : 10PX;
BORDER-RIGHT : 1PX solid #bcb297;}

DIV#RIGHT {
MARGIN : 10PX 0PX 50PX;
PADDING : 0PX 15PX;}

DIV.HEADER {
FONT-FAMILY : TAHOMA;
FONT-SIZE : 13PT;
FONT-WEIGHT : BOLD;
TEXT-ALIGN : LEFT;
MARGIN : 10PX 0PX 50PX 30PX;}

DIV.HEADER A:LINK {COLOR: #bcb297; TEXT-DECORATION: NONE}
DIV.HEADER A:VISITED {COLOR: #bcb297; TEXT-DECORATION: NONE}
DIV.HEADER A:HOVER {COLOR: #514c40; TEXT-DECORATION: NONE}


DIV.URL {
MARGIN-TOP : 6PX;
FONT-FAMILY : VERDANA,TAHOMA ;
FONT-SIZE : 8PT;
LETTER-SPACING : 1PX;
TEXT-ALIGN : LEFT;
MARGIN : -40PX 0PX 50PX 30PX;}

DIV.URL A:LINK {COLOR: #bcb297; TEXT-DECORATION: NONE}
DIV.URL A:VISITED {COLOR: #bcb297; TEXT-DECORATION: NONE}
DIV.URL A:HOVER {COLOR: #514c40; TEXT-DECORATION: NONE}

DIV.USERMENU_LINK {
WIDTH : 170PX;
FONT-FAMILY : VERDANA,;
FONT-SIZE : 10PT;
BORDER-BOTTOM : 1PX solid #bcb297;
TEXT-ALIGN : CENTER;
PADDING-BOTTOM : 5PX;}

DIV.USERMENU_LINK A:LINK {COLOR: #bcb297; TEXT-DECORATION: NONE}
DIV.USERMENU_LINK A:VISITED {COLOR: #bcb297; TEXT-DECORATION: NONE}
DIV.USERMENU_LINK A:HOVER {COLOR: #514c40; TEXT-DECORATION: NONE}

DIV.PROFILE {
WIDTH : 150PX;
MARGIN : 10PX 0PX;
TEXT-ALIGN : CENTER;
PADDING : 10PX 10PX 15PX 10PX;
LINE-HEIGHT : 130%;
OVERFLOW : HIDDEN;}

DIV.MN {
WIDTH : 150PX;
MARGIN : 0PX 0PX 0PX;
PADDING : 0PX 0PX 10PX 10PX;
BORDER-BOTTOM : 1PX solid #bcb297;
LINE-HEIGHT : 150%;
OVERFLOW : HIDDEN;}


DIV.MNTTL {BACKGROUND-IMAGE : URL(http://pds.exblog.jp/pds/1/201003%2F11%2F38%2Ff0165338_15111349.jpg); PADDING : 2PX 0PX 0PX; MARGIN : 25PX 0PX 10PX;
WIDTH : 150PX; height:15px
FONT-FAMILY : VERDANA,;
FONT-WEIGHT : BOLD;
COLOR : #FFFFFF;text-align:center;}

DIV.MEMOBODY {
WIDTH : 150PX;
OVERFLOW : HIDDEN;}

DIV.POST {PADDING-BOTTOM : 30PX;
MARGIN-BOTTOM : 15PX;}

DIV.POST_HEAD {
MARGIN : 0PX 0PX 15PX;
OVERFLOW : HIDDEN;}

DIV.POST_BODY {
MARGIN-TOP : 3PX;
MARGIN-BOTTOM : 30PX;
LINE-HEIGHT : 1.5;
BORDER : 1PX #000;}

DIV.POST_BODY {
WIDTH : 500PX;
OVERFLOW : HIDDEN;}



DIV.POST_TTL {WIDTH : 550PX;
FONT-SIZE : 9PT;MARGIN : 0PX 0PX 0PX;
FONT-WEIGHT : BOLD;BORDER-BOTTOM : 1PX solid #bcb297;}



DIV.POST_TAIL {
FONT-FAMILY : TAHOMA,;
FONT-SIZE : 8PT;
MARGIN-TOP : 10PX;
TEXT-ALIGN : RIGHT;}

DIV.COMMENT {
MARGIN : 40PX 0PX 0PX;BORDER : 1PX solid #bcb297;
BACKGROUND : #FFFFFF;
PADDING : 10PX 15PX;
LINE-HEIGHT : 130%;}

DIV.COMMENT_BODY {
MARGIN : 6PX 0PX 20PX;
LINE-HEIGHT : 140%;
OVERFLOW : HIDDEN;}

DIV.COMMENT_TAIL {
MARGIN : 8PX 0PX 5PX;
FONT-FAMILY : VERDANA, TAHOMA,;
FONT-SIZE : 8PT;
COLOR : #777;}

DIV.COMMENT_INPUT {
MARGIN-TOP : 20PX;
BORDER-TOP : 1PX #AAA DOTTED;
PADDING-TOP : 20PX;}

DIV.COMMENT_LINE {
BORDER-TOP : 1PX #AAA DOTTED;
MARGIN : 10PX 0PX 15PX;}

DIV.TRACK_TOP {
LINE-HEIGHT : 170%;}

DIV.ARCHIVE_HEAD {
FONT-WEIGHT : BOLD;
MARGIN-BOTTOM : 10PX;}

DIV.ARCHIVE_BODY {
MARGIN : 20PX 0PX;
LINE-HEIGHT : 160%;
PADDING-BOTTOM : 100PX;}

IMG.IMAGE_TOP {
MARGIN-BOTTOM : 15PX;}

IMG.IMAGE_LEFT {
MARGIN-RIGHT : 15PX;
MARGIN-BOTTOM : 10PX;}

IMG.IMAGE_RIGHT {
MARGIN-LEFT : 10PX;
MARGIN-BOTTOM : 10PX;}

IMG.IMAGE_MID {
MARGIN-TOP : 15PX;
MARGIN-BOTTOM : 15PX;}

IMG.BOOKMK {
MARGIN : 10PX;
BORDER : 0PX;}

IMG.USERMENU_LINK {
MARGIN-LEFT : 8PX;}

IMG.LOGO {
MARGIN-BOTTOM : 10PX;}

DIV.BANNER {
MARGIN : 30PX 0px 10px;}

.SMALL {
FONT-SIZE : 11PX;}

.DATE {
FONT-FAMILY : VERDANA, TAHOMA,;
FONT-SIZE : 8PT;
FONT-WEIGHT : BOLD;}

.TIME {
FONT-FAMILY : VERDANA, TAHOMA,;
FONT-SIZE : 8PT;
TEXT-ALIGN : LEFT;}

.AUTHOR {
FONT-SIZE : 9PT;
FONT-WEIGHT : BOLD;}

.TXTFLD{FONT-SIZE:9PT;COLOR:#000; BORDER:1PX SOLID #666678; BACKGROUND:WHITE}




DIV.CAL_TOP {}

DIV.CAL {
WIDTH : 170PX;
MARGIN : 10PX 0PX;
PADDING-BOTTOM : 20PX;
TEXT-ALIGN : CENTER;}

DIV.CAL_HEAD {
WIDTH : 150PX;
FONT-SIZE : 8PT;
FONT-FAMILY : VERDANA;
TEXT-ALIGN : CENTER;
PADDING : 4PX 10PX;
MARGIN-BOTTOM : 10PX;}

DIV.CAL_BODY {
WIDTH : 150PX;
PADDING : 0PX 10PX;
TEXT-ALIGN : CENTER;
BACKGROUND : #FFF;}

DIV.CAL_BOTTOM {}

.CAL {
FONT-FAMILY : VERDANA,;
FONT-SIZE : 7PT;
TEXT-ALIGN : CENTER;
LINE-HEIGHT : 170%;}

.CAL_DAY {
FONT-FAMILY : VERDANA,;
FONT-SIZE : 7PT;
FONT-WEIGHT : BOLD;
TEXT-ALIGN : CENTER;
LINE-HEIGHT : 170%;}

.CAL_SUN {
FONT-FAMILY : VERDANA,;
FONT-SIZE : 7PT;
FONT-WEIGHT : BOLD;
COLOR : #D36654;
TEXT-ALIGN : CENTER;
LINE-HEIGHT : 170%;}

.CAL_SAT {
FONT-FAMILY : VERDANA,;
FONT-SIZE : 7PT;
FONT-WEIGHT : BOLD;
COLOR : #3572A1;
TEXT-ALIGN : CENTER;
LINE-HEIGHT : 170%;}

.CAL_TODAY {
FONT-FAMILY : VERDANA,;
FONT-SIZE : 7PT;
FONT-WEIGHT : BOLD;
BACKGROUND : #bcb297;
COLOR : #FFFFFF;
TEXT-ALIGN : CENTER;}

.CAL_TR {BACKGROUND : #FFF;}

DIV.XML {
TEXT-ALIGN : CENTER;
FONT-SIZE : 8PT;
FONT-FAMILY : VERDANA;
MARGIN-BOTTOM : 30PX;}

TEXTAREA.TXTFLD {height:10em;}/*コメント入力欄を広く*/

[PR]
Top▲ | by mari_ca by animal_skin | 2010-03-12 18:31 | イラストもの
<< 「野草の花」のスキン配布 「W... | ページトップ | 「厚紙の3列」スキン配布 「C... >>
↓質問はこちらへ↓