スキン「CSSエキサイトブックス-物語のある風景」

c0041583_1130022.jpg

かわいいロボットのスキン「物語のある風景」を携帯から見られるようにCSSでがんばってみた。




--------------テンプレート・全体-------------------------



<$menuleft$>




<$post$>
<$prepage type=1$>
<$nextpage type=1$>





-----------------テンプレート・左メニュー----------------------



-----------------テンプレート・右メニュー-----------------------



----------------- テンプレート・本文 ----------------------------




<$postsubject$>

<$postadmin type=1$>



<$postcont$>

<$posttail$>

<$cmtjs$>




------------------ CSS -----------------------------------
/* ----------------- overall styles ---------------------------- */
A:LINK { COLOR: #0000FF; TEXT-DECORATION: NONE; }
A:VISITED { COLOR: #0000FF; TEXT-DECORATION: NONE; }
A:ACTIVE { COLOR: #0000FF; TEXT-DECORATION: NONE; }
A:HOVER { COLOR: #813888; TEXT-DECORATION: UNDERLINE; }
BODY,TD,DIV,LI { FONT-SIZE : SMALL; FONT-FAMILY : VERDANA,ARIAL,SANS-SERIF; LINE-HEIGHT : 150%; COLOR : #000; }
DIV.header A:LINK { COLOR: #000; TEXT-DECORATION: NONE; }
DIV.header A:VISITED { COLOR: #000; TEXT-DECORATION: NONE; }
DIV.header A:HOVER { COLOR: #888; TEXT-DECORATION: NONE; }
div.header {
text-align:center;
padding-top:70px;
}
DIV.URL {
FONT : 12px/100% "VERDANA", "TAHOMA";
TEXT-ALIGN:center;
letter-spacing: 1px;
margin-top: 7px;
}
DIV.USERMENU {
FONT : 12px/100% "Verdana", "MS ゴシック", "Osaka-等幅";
TEXT-ALIGN : center;
margin-top: 20px;
}

DIV.USERMENU A:LINK {COLOR: #727272; TEXT-DECORATION: NONE}
DIV.USERMENU A:VISITED {COLOR: #727272; TEXT-DECORATION: NONE}
DIV.USERMENU A:HOVER {COLOR: #98A6E4; TEXT-DECORATION: UNDERLINE;}

/* ------------------ page layout ------------------------------- */
body {
margin:0;
padding:0;
}
div.layout {
margin:0;
padding:0;
}
div#head {
background: #EEF3EF url(http://md.exblog.jp/skn/img/a/01/03/0/illust3a.jpg) no-repeat;
border-right: 1px solid #CCCCCC;
border-left: 1px solid #CCCCCC;
height: 200px;
width:780px;
margin-left:auto;
margin-right:auto;
}
div#body {
width:782px;
background: #EEF3EF url(http://md.exblog.jp/skn/img/a/01/03/0/illust3b.jpg) no-repeat;
border-right: 1px solid #CCCCCC;
border-left: 1px solid #CCCCCC;
margin-left:auto;
margin-right:auto;
}
div#left {
float:left;
width:160px;
border: 1px solid #CCCCCC;
margin:20px 0px 0px 5px;
background-color: #FFFFFF;
overflow:hidden;
}
div#leftrest {
width:605px;
overflow:hidden;
}
div#right {
float:right;
border: 1px solid #CCCCCC;
width:160px;
margin:20px 5px 0px 0px;
background-color: #FFFFFF;
overflow:hidden;
}
div#center {
background: #FFFFFF;
border: 1px solid #CCCCCC;
width:418px;
margin-right: 5px;
margin-top: 20px;
margin-left: 5px;
overflow:hidden;
}

/* ----------- post contents ------------- */
DIV.PROFILE {
TEXT-ALIGN:left;
font: normal 12px/130% "Verdana", "MS ゴシック", "Osaka-等幅";
background: #FFFFFF;
padding-top: 5px;
padding-bottom: 15px;
}
div.menuitem {
margin:5px;
}

DIV.MN_R {
TEXT-ALIGN:left;
font: normal 12px/140% "Verdana", "MS ゴシック", "Osaka-等幅";
margin-top: 10px;
margin-bottom: 10px;
}
DIV.MNTTL_R {
color: #585858;
font: bold 12px "Verdana", "MS ゴシック", "Osaka-等幅";
background: url(http://md.exblog.jp/skn/img/a/01/03/0/skin2_mnttl.gif) no-repeat top;
padding: 4px 5px 14px;
border-top: 1px solid #FFFFFF;
}
DIV.MN_L {
TEXT-ALIGN : left;
MARGIN-BOTTOM : 10px;
font: normal 12px/140% "Verdana", "MS ゴシック", "Osaka-等幅";
margin-top: 10px;
}
DIV.MNTTL_L {
TEXT-ALIGN : left;
color: #5E5E5E;
font: bold 12px "Verdana", "MS Pゴシック", "Osaka";
background: url(http://md.exblog.jp/skn/img/a/01/03/0/skin2_mnttl.gif) no-repeat top;
padding: 4px 5px 14px;

}
DIV.MEMOBODY {
WIDTH : 150PX;
font: normal 12px/150% "Verdana", "MS ゴシック", "Osaka-等幅";
}

DIV.POST {
margin:5px 8px 30px 8px;
TEXT-ALIGN:left;
}
DIV.POST_HEAD { BORDER-BOTTOM : 1px solid #CCC; MARGIN-BOTTOM : 15PX; PADDING-BOTTOM : 3PX; }
DIV.POST_TTL {
color: #A86900;
font: bold 14px/130% "Verdana", "MS ゴシック", "Osaka-等幅";

}
DIV.POST_ADMIN {
TEXT-ALIGN : right;
font: normal 12px "Verdana", "MS ゴシック", "Osaka-等幅";
}
DIV.POST_BODY {
MARGIN-BOTTOM : 15px;
font: 12px/160% "Verdana", "MS ゴシック", "Osaka-等幅";
color: #4F4F4F;
width: 400px;

}
DIV.POST_TAIL {
FONT : normal 11px "Tahoma", "MS ゴシック", "Osaka-等幅";
MARGIN-TOP : 5px;
TEXT-ALIGN : right;

}

DIV.COMMENT {
BORDER : 1px solid #D3D3D3;
BACKGROUND : #F7F7F7;
PADDING : 10px 5px;
margin-top: 20px;

}
DIV.COMMENT_BODY {
LINE-HEIGHT : 130%;
padding-right: 5px;
padding-left: 5px;
}
DIV.COMMENT_TAIL { MARGIN : 8PX 0PX 5PX; FONT : 8PT/150% TAHOMA; 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 : 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 : BOLD 8PT/150% TAHOMA; }
.TIME { FONT : 8PT/150% TAHOMA; TEXT-ALIGN : LEFT; }
.AUTHOR { FONT : bold 8pt "TAHOMA"; }
.TXTFLD { FONT-SIZE:9PT;COLOR:#000; BORDER:1PX SOLID #666678; BACKGROUND:#FFF; }
.SUBMIT { FONT :9PT/140% ;COLOR:#000; }

DIV.CAL_TOP { }
DIV.CAL { MARGIN : 20PX 0PX 20PX; WIDTH : 150PX; TEXT-ALIGN : CENTER;}
DIV.CAL_HEAD { WIDTH : 150PX; FONT : 8PT/150% VERDANA; TEXT-ALIGN : CENTER; PADDING : 4PX 0PX; MARGIN-BOTTOM : 10PX;}
DIV.CAL_BODY { WIDTH : 150PX; TEXT-ALIGN : CENTER;}
DIV.CAL_BOTTOM { }

.CAL { FONT : 7PT/170% VERDANA; TEXT-ALIGN : CENTER; }
.CAL_DAY { FONT : BOLD 7PT/170% VERDANA; TEXT-ALIGN : CENTER; }
.CAL_SUN { FONT : BOLD 7PT/170% VERDANA; COLOR : #D36654; TEXT-ALIGN : CENTER; }
.CAL_SAT { FONT : BOLD 7PT/170% VERDANA; COLOR : #3572A1; TEXT-ALIGN : CENTER; }
.CAL_TODAY { FONT : BOLD 7PT/170% VERDANA; BACKGROUND : #E3E3E3; COLOR : #3D5586; TEXT-ALIGN : CENTER; }
.CAL_TR { }

DIV.XML { FONT : 8PT/150% VERDANA; TEXT-ALIGN : CENTER; }
[PR]
by tockri | 2005-02-18 11:35 | ├ コンピュータ
移転しました。
by tockri
S M T W T F S
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
最新のトラックバック
[media][gove..
from bewaad institu..
甘やかされた男たち
from とっくりばー
~が下手
from たのしい検索・ゆかいな検索
例えバトン
from ひまわりてんびんへの道
例えバトン
from 明日は明日のホラを吹く-To..
リンク
ライセンス

クリエイティブ・コモンズ・ライセンス

このブログのテキストおよび画像は、クリエイティブ・コモンズ・ライセンスの下でライセンスされています。




検索
ファン
ブログジャンル
画像一覧