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

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



グリーンのチェック柄が背景になっています。
エキサイト配布スキンの一つである「クリアホワイト」というスキンを改造したものです。


シンプルなスキンの背景に手持ちの画像を使いたい...という人は
私がここでベースに使った「クリアホワイト」を編集するのが簡単かも。
その場合は、CSSのBODY内にあるBACKGROUND-IMAGE : URLの次に、
背景に使いたい画像をいれればOKです。
あとはプレビューで確認しながらいろいろいじってみたら楽しいかも。^^







■「メイン」■ 枠の中をすべてコピーして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=1$></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">
"GreenChecker1" 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=30><img src="http://pds.exblog.jp/pds/1/200806%2F23%2F38%2Ff0165338_1155628.jpg" border="0">
</TD>
<TD WIDTH=490>
<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編集」部分に貼ってください。

/* GreenChecker1 Skin by Animal Skin*/

/* 固定背景を解除したい人は、↓この中のbackground-attachment: fixed;というのを消しちゃってね*/
BODY{ BACKGROUND-IMAGE : URL(http://pds.exblog.jp/pds/1/200806%2F23%2F38%2Ff0165338_11544180.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 : #222222; WORD-BREAK : BREAK-ALL; }

A:LINK{ COLOR: #89725B; TEXT-DECORATION: NONE }
A:VISITED{ COLOR: #89725B; TEXT-DECORATION: NONE }
A:ACTIVE{ COLOR: #89725B; }
A:HOVER{ COLOR: #8DB48F; }

DIV#BODY {
BACKGROUND : #FFF;

WIDTH : 740PX;
TEXT-ALIGN : LEFT;
}

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

DIV#TOP2 {
BORDER-BOTTOM : 4PX dotted #DDF5DE;
PADDING : 0PX 0PX 25PX;
WIDTH : 741PX;
}

DIV#LEFT {
MARGIN : 10PX 0PX 50PX 10PX;
PADDING-RIGHT : 10PX;
BORDER-RIGHT : 4PX dotted #DDF5DE;
}

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

DIV.HEADER {
FONT-FAMILY : TAHOMA;
FONT-SIZE : 13PT;
FONT-WEIGHT : BOLD;
TEXT-ALIGN : CENTER;
}

DIV.HEADER A:LINK {COLOR: #444444; TEXT-DECORATION: NONE}
DIV.HEADER A:VISITED {COLOR: #444444; TEXT-DECORATION: NONE}
DIV.HEADER A:HOVER {COLOR: #8DB48F; TEXT-DECORATION: NONE}


DIV.URL {
MARGIN-TOP : 6PX;
FONT-FAMILY : VERDANA,TAHOMA ;
FONT-SIZE : 10PT;
LETTER-SPACING : 1PX;
TEXT-ALIGN : CENTER;
}

DIV.URL A:LINK {COLOR: #888888; TEXT-DECORATION: NONE}
DIV.URL A:VISITED {COLOR: #888888; TEXT-DECORATION: NONE}
DIV.URL A:HOVER {COLOR: #D4F1D2; TEXT-DECORATION: NONE}

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

DIV.USERMENU_LINK A:LINK {COLOR: #666666; TEXT-DECORATION: NONE}
DIV.USERMENU_LINK A:VISITED {COLOR: #666666; TEXT-DECORATION: NONE}
DIV.USERMENU_LINK A:HOVER {COLOR: #D4F1D2; TEXT-DECORATION: NONE}

DIV.PROFILE {
WIDTH : 150PX;
MARGIN : 10PX 0PX;
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 : 2PX dotted #D4F1D2;
LINE-HEIGHT : 150%;
OVERFLOW : HIDDEN;
}


DIV.MNTTL {BACKGROUND-IMAGE : URL(http://pds.exblog.jp/pds/1/200806%2F23%2F38%2Ff0165338_11545464.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 {BORDER-BOTTOM : 1PX solid #D4F1D2;
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 : 520PX;
OVERFLOW : HIDDEN;
}



DIV.POST_TTL {WIDTH : 470PX;
FONT-SIZE : 9PT;MARGIN : 0PX 10PX 0PX;
FONT-WEIGHT : BOLD;BORDER-BOTTOM : 2PX dotted #D4F1D2;
BORDER-top : 2PX dotted #D4F1D2;
}



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

DIV.COMMENT {
MARGIN : 40PX 0PX 0PX;BORDER : 2PX solid #D4F1D2;
BACKGROUND : #F4FFF5;
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 : #E2E2E2;
COLOR : #3D5586;
TEXT-ALIGN : CENTER;
}

.CAL_TR {BACKGROUND : #FFF;}

DIV.XML {
TEXT-ALIGN : CENTER;
FONT-SIZE : 8PT;
FONT-FAMILY : VERDANA;
MARGIN-BOTTOM : 80PX;
}
TEXTAREA.TXTFLD {height:10em;}/*コメント入力欄を広く*/

[PR]
Top▲ | by mari_ca by animal_skin | 2008-06-24 04:53 | トップ画像のないスキン
<< 「グレーのチェック柄背景」スキ... | ページトップ | 「紙きれ」のスキン配布 「Pa... >>
↓質問はこちらへ↓