-Sun&Moon Blog-
catsmoon.exblog.jp
エキサイトブログスキン配布 (Mac OS10.5 Leopard・Safari) ★基本的にコメントにレスしません
by catsmoon
プロフィールを見る
画像一覧
Top | Out
ドロップスキン配布
2005年 01月 02日 |
b0052317_2344054.gif 2列右メニューのスキンです。

プレビューページ>>
※プレビューページにはトップ、ログインなどのユーザーメニューと、記事の編集などのメニューは出ません。
メニューも、上下や左右の振り分けを認識しないため綺麗な配置になっていません。
リンクは無効になっているため、コメントを開くこともできません。雰囲気を見るだけのものとご了承下さい。


構成自体は特に目立つものはありませんが、各記事やメニューから、ページトップやボトムに飛べるリンクを貼っています。
また記事の終わりのアイコン(水色のアイコン)で各記事やカテゴリのページからindexページに戻るようにもしました。

b0052317_17585511.jpg
こちらはロゴ用画像です。






素材は自作ですのでご自由にどうぞ。
   




2列のレイアウト(右)  オリジナル 本文 500-ロゴ160- メニュー 160
------------------------------------------------------------------------------------------
★メインページ用HTML

<!--
このスキンの作成者は、月蝕 http://catsmoon.exblog.jp/ です。
素材も含めて著作権は月蝕に帰属します。 カスタマイズはご自由ですが、この著作権表示部分を削除改変することは認めません。必ず残して下さい。
またカスタマイズしたものを配布したい場合、必ず当ブログの利用規約を確認、ルールを守って配布して下さい。
-->
<a name="top"> </a>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=100%>
<TR><TD VALIGN=TOP>
<div class=left>
<DIV CLASS=HEADER><$header$><br>
<img src="http://pds.exblog.jp/pds/1/200501/02/17/line.gif" border="0"></DIV>
<DIV CLASS=URL><$blogurl$></DIV>
<DIV CLASS=USERMENU><$adminmenu type=2$></DIV>
<$post$>
<div class=page>
<span class=page><$prepage type=1$></span>
<span class=page><$nextpage type=1$></span>
</div>
</div>
</TD>
<TD VALIGN=TOP width=180>
<div class=right>
<DIV CLASS=MNBODY>
<CENTER><$logoimage type=1$></CENTER>
<$description$>
<$nick$>
</DIV>
<DIV CLASS=MNTTL><img src="http://pds.exblog.jp/pds/1/200501/02/17/i-y.gif" border="0">Calender</DIV>
<$calendar type=1$>
<DIV CLASS=MNTTL><img src="http://pds.exblog.jp/pds/1/200501/02/17/i-y.gif" border="0">外部Link</DIV>
<div class=MNBODY>自由にどうぞ
<div class=up><a href="#top" target="_self">▲</a></div>
</div>

<$menuright$>
<$banner type=1$>
<$xml$>
<div class=XML>
The Original by <a href="http://catsmoon.exblog.jp/" target="_blank">Sun&Moon</a></div>
</TD></TR>
</TABLE>
<a name=bottom> </a>
------------------------------------------------------------------------------------------
★CSS

/* excite blog skin css */

BODY{ BACKGROUND : #FFFFFF; MARGIN : 0PX;
PADDING : 10PX 0px 10px 90px;
background-image:url("http://pds.exblog.jp/pds/1/200501/02/17/dropw.jpg");
background-repeat:repeat-y;
background-attachment:fixed; }
BODY,TD,DIV,LI{ FONT-SIZE : 9pt;
FONT-FAMILY : Chalkboard,Hiragino Maru Gothic Pro,VERDANA,ARIAL,SANS-SERIF; LINE-HEIGHT : 150%; COLOR : #666666; }

A:LINK{ COLOR: #092094; TEXT-DECORATION: NONE; }
A:VISITED{ COLOR: #092094; TEXT-DECORATION: NONE; }
A:ACTIVE{ COLOR: #092094; TEXT-DECORATION: NONE; }
A:HOVER{ COLOR: #C7CF4C; TEXT-DECORATION: none; }

.left{padding:0px 40px 0px 20px;}
.right{padding:0px 10px;}

DIV.HEADER{ font-size:16pt; TEXT-ALIGN:center;}

DIV.HEADER A:LINK { COLOR: #3296CC; TEXT-DECORATION: NONE; }
DIV.HEADER A:VISITED { COLOR: #3296CC; TEXT-DECORATION: NONE; }
DIV.HEADER A:HOVER { COLOR: #888; TEXT-DECORATION: NONE; }

DIV.URL{ font-size : 8pt; MARGIN : 10PX 0PX 5PX; TEXT-ALIGN:right;}
DIV.USERMENU{ font-size : 9pt; TEXT-ALIGN : RIGHT; MARGIN-BOTTOM : 20PX; }

DIV.USERMENU A:LINK {COLOR: #727272; TEXT-DECORATION: NONE}
DIV.USERMENU A:VISITED {COLOR: #727272; TEXT-DECORATION: NONE}
DIV.USERMENU A:HOVER {COLOR: #3296CC; TEXT-DECORATION: none;}

DIV.MNBODY{ WIDTH : 160PX; TEXT-ALIGN:LEFT; padding:0px 0px 25px;
}
DIV.MNTTL{ WIDTH : 160PX; border-bottom:1px #E4E8A8 solid;
PADDING : 2PX 0PX 0px; color:#3296CC;
MARGIN : 5PX 0PX 10PX; }
.MNTTL img{vertical-align:middle;}
DIV.MEMOBODY{ WIDTH : 160PX; OVERFLOW : HIDDEN; }

.up{font-size:7pt; text-align:right;}
.up A:LINK {COLOR: #3296CC; TEXT-DECORATION: NONE}
.up A:VISITED {COLOR: #3296CC; TEXT-DECORATION: NONE}
.up A:HOVER {COLOR: #888888; TEXT-DECORATION: none;}

DIV.POST{ MARGIN-BOTTOM : 50PX; TEXT-ALIGN:LEFT;}
DIV.POST_HEAD{ BORDER-BOTTOM : 1PX #C7CF4C SOLID; PADDING-BOTTOM : 3PX; }
DIV.POST_TTL{ font-size:10pt; COLOR : #2B7297;}
DIV.POST_TTL a:hover{color:#2B7297;}
DIV.POST_TTL img{vertical-align:middle;}
DIV.POST_ADMIN{ TEXT-ALIGN : RIGHT; font-size:9pt;}
DIV.POST_BODY{ LINE-HEIGHT : 150%; MARGIN-BOTTOM : 30PX; OVERFLOW : HIDDEN; }
DIV.POST_TAIL{ font-size:8pt; MARGIN-TOP : 10PX; TEXT-ALIGN : RIGHT; }
DIV.POST_TAIL img{vertical-align:middle;}

DIV.COMMENT{ BORDER : 1PX #C7CF4C SOLID; BACKGROUND : #ffffff;PADDING : 15PX;MARGIN : 20PX 0PX; }
DIV.COMMENT_BODY{ MARGIN-BOTTOM : 20PX; LINE-HEIGHT : 130%;}
DIV.COMMENT_TAIL{ MARGIN : 8PX 0PX 5PX; 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; }

.ptime{text-align:right; margin:2px 0px 15px 0px;}
.page{margin:20px; text-align:center;}




DIV.TRACK_TOP { LINE-HEIGHT : 170%; }
DIV.ARCHIVE_HEAD { 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 : 15PX; }
IMG.IMAGE_MID{ MARGIN-TOP : 15PX; MARGIN-BOTTOM : 15PX; }
IMG.BOOKMK{ MARGIN : 10PX; BORDER : 0PX; }
IMG.USERMENU{ MARGIN-LEFT : 8PX; }
IMG.LOGO{ MARGIN-BOTTOM : 10PX; }

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

.SMALL{ FONT-SIZE : 11PX; }
.DATE{ font-size:8pt; }
.TIME{ font-size:8pt; TEXT-ALIGN : LEFT; }
.AUTHOR{ font-size:8pt; }
.TXTFLD{ FONT-SIZE:9PT;COLOR:#444444; BORDER:1PX SOLID #C7CF4C; BACKGROUND:#FFF; }
.SUBMIT{ FONT :9PT/140% ;COLOR:#444444; }


DIV.CAL_TOP { }
DIV.CAL { MARGIN : 0PX 0PX 20PX; WIDTH : 160PX; TEXT-ALIGN : CENTER;}
DIV.CAL_HEAD { WIDTH : 160PX; FONT-size:8pt; TEXT-ALIGN : CENTER;
PADDING : 0PX; MARGIN-BOTTOM : 10PX;}
DIV.CAL_BODY { WIDTH : 160PX; TEXT-ALIGN : CENTER;}
DIV.CAL_BOTTOM { }

.CAL{ font-size:8pt; TEXT-ALIGN : CENTER; background-color:#F4F5E8; }
.CAL_DAY{font-size:8pt; TEXT-ALIGN : CENTER; }
.CAL_SUN{ font-size:8pt; COLOR : #D36654; TEXT-ALIGN : CENTER;}
.CAL_SAT{ font-size:8pt; COLOR : #3572A1; TEXT-ALIGN : CENTER;}
.CAL_TODAY{ font-size:8pt; BACKGROUND : #E3E3E3; COLOR : #3D5586; TEXT-ALIGN : CENTER; }
.CAL_TR { }

DIV.XML { font-size:8pt; TEXT-ALIGN : CENTER; }
------------------------------------------------------------------------------------------
★本文用HTML

<DIV CLASS=POST>
<DIV CLASS=POST_HEAD>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=100%>
<TR><TD WIDTH=80%><div class=POST_TTL><img src="http://pds.exblog.jp/pds/1/200501/02/17/i-b.gif" border="0"> <$postsubject$></div></TD>
<TD WIDTH=20% ALIGN=RIGHT><div class=POST_ADMIN><$postadmin type=1$> <a href="#bottom" target="_self">▼</a></div></TD></TR>
</TABLE>
</DIV>
<div class=ptime><$postdate$></div>
<DIV CLASS=POST_BODY>
<$postcont$>
</DIV>
<DIV CLASS=POST_TAIL ALIGN=RIGHT><$posttail$> <a href="./" target="_self"><img src="http://pds.exblog.jp/pds/1/200501/02/17/i-lb.gif" border="0"></a></DIV>
<$cmtjs$>
<div class=up><a href="#top" target="_self">▲</a></div>
</DIV>
------------------------------------------------------------------------------------------
★メニュー用HTML

<DIV CLASS=MNTTL><img src="http://pds.exblog.jp/pds/1/200501/02/17/i-y.gif" border="0"><$mntitle$></DIV>
<div class=MNBODY><$mnbody$>
<div class=up><a href="#top" target="_self">▲</a></div>
</div>
------------------------------------------------------------------------------------------
背景画像指定がCSS内に一カ所、画像指定が、メインページ用HTML内に3カ所、本文用HTML内に2カ所、メニュー用HTML内に1カ所あります(赤字)

青字の部分はご自由に外部リンクなど書き込んで頂けます。

ページトップやボトムに飛ぶリンクは▲や▼になっています。これはお好きな文字や画像に変更ができます。

また本文用HTML内に1カ所、ご自分のブログのアドレスに変える場所があります。
ここは記事の末尾にあるアイコンをクリックするとindexページに戻るリンクになります。デフォルトのままだと、カテゴリのページや月別のページからは戻りますが、コメントなどから直接記事に飛んだ場合は戻れませんので、書き換えることをすすめます。
(背景色緑の ./ という部分をアドレスに変えて下さい)
[PR]
by catsmoon | 2005-01-02 19:10 | 可愛い
<< 仕事始め PageTop ページトップに戻る小技 >>
XML | ATOM

個人情報保護
情報取得について
免責事項
Blue Paper Skin by Sun&Moon