tomemo

スキン「シンプルパターン」を右サイドバー化するためのHTML/CSS -ブラック-

スキン「シンプルパターン」を右サイドバー化するためのHTML/CSSのブラックバージョンです。




HTML


<div align="center">
<div id="BODY">
<div id="BODY2">
<table width="710" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td colspan="2" valign="top">
<div id="TOP">
<table border="0" cellpadding="0" cellspacing="0" width="710">
<tr>
<td align="left" width="710">
<div class="HEADER"><$header$></div>
</td>
</tr>
</table>
<div class="URL"><$blogurl$></div>
<div class="USERMENU"><$adminmenu type=1$></div>
</div>
</td>
</tr>
<tr>
<td width="500" valign="top">
<div id="RIGHT">
<$post$>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="right" width="45%"><$prepage type=1$></td>
<td width="10%">
</td>
<td align="left" width="45%"><$nextpage type=1$></td>
</tr>
</table>
</div>
</td>
<td width="210" valign="top">
<div id="LEFT">
<div class="PROFILE">
<div align="center"><$logoimage type=1$></div>
<$description$>
<$nick$>
</div>
<$calendar type=1$>
<div class="MN"><$menuleft$></div>
<$banner type=1$>
<$xml$>
</div>
</td>
</tr>
</table>
</div>
</div>
</div>


CSS


/* excite blog skin css */

BODY{ BACKGROUND : #646464; MARGIN : 0PX;PADDING : 0PX; }
BODY,TD,DIV,LI{ FONT-SIZE : SMALL; FONT-FAMILY : VERDANA,ARIAL,SANS-SERIF; LINE-HEIGHT : 150%; WORD-BREAK : BREAK-ALL; COLOR : #AAA; }

A:LINK{ COLOR: #6C839E; TEXT-DECORATION: NONE }
A:VISITED{ COLOR: #6C839E; TEXT-DECORATION: NONE }
A:ACTIVE{ COLOR: #6C839E; TEXT-DECORATION: NONE }
A:HOVER{ COLOR: #B6B6B6; TEXT-DECORATION: UNDERLINE }


DIV#BODY {
WIDTH : 724PX;
BACKGROUND : #000;
BORDER-LEFT : 6PX SOLID #555;
BORDER-RIGHT : 6PX SOLID #555;
}

DIV#BODY2 {
WIDTH : 712PX;
BORDER-LEFT : 1PX SOLID #555;
BORDER-RIGHT : 1PX SOLID #555;
TEXT-ALIGN : LEFT;
}

DIV#TOP {
BACKGROUND : #000;
}

DIV#LEFT {
PADDING-LEFT : 30PX;
PADDING-RIGHT : 30PX;
MARGIN-BOTTOM : 40PX;
WIDTH : 150PX;
WORD-BREAK : BREAK-ALL;
OVERFLOW : HIDDEN;
}

DIV#RIGHT {
PADDING-left : 10PX;
MARGIN-BOTTOM : 40PX;
WIDTH : 490PX;
}

DIV.HEADER {
MARGIN : 40PX 30PX 5PX;
FONT : BOLD 13PT TAHOMA,GEORGIA;
}

DIV.HEADER A:LINK {COLOR: #6C7F8C; TEXT-DECORATION: NONE}
DIV.HEADER A:VISITED {COLOR: #6C7F8C; TEXT-DECORATION: NONE}
DIV.HEADER A:HOVER {COLOR: #BBB; TEXT-DECORATION: NONE}


DIV.URL {
MARGIN-LEFT : 30PX;
LETTER-SPACING : 5PX;
FONT-SIZE : 10PT;
}

DIV.URL A:LINK {COLOR: #6C7F8C; TEXT-DECORATION: NONE}
DIV.URL A:VISITED {COLOR: #6C7F8C; TEXT-DECORATION: NONE}
DIV.URL A:HOVER {COLOR: #DDD; TEXT-DECORATION: NONE}

DIV.USERMENU {
MARGIN : 25PX 10PX 5PX;
TEXT-ALIGN : RIGHT;
}

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}

DIV.PROFILE {
LINE-HEIGHT : 160%;
}

DIV.MN {
MARGIN-TOP : 5PX;
MARGIN-BOTTOM : 10PX;
LINE-HEIGHT : 160%;
FONT-FAMILY : TAHOMA;
}

DIV.MNTTL {
MARGIN-TOP : 30PX;
MARGIN-BOTTOM : 10PX;
COLOR : #596A75;
FONT-WEIGHT : BOLD;
}

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

DIV.POST {
MARGIN-TOP : 3PX;
MARGIN-BOTTOM : 35PX;
BACKGROUND : #333;
PADDING : 20PX;
}

DIV.POST_HEAD {
BORDER-TOP : 1PX DOTTED #006E90;
BORDER-BOTTOM : 1PX DOTTED #006E90;
PADDING-TOP : 3PX;
PADDING-BOTTOM : 3PX;
FONT-FAMILY : VERDANA;
LETTER-SPACING : 5PX;
COLOR : #727272;
}

DIV.POST_BODY {
WIDTH : 450PX;
MARGIN-TOP : 25PX;
MARGIN-BOTTOM : 35PX;
LINE-HEIGHT : 1.5;
OVERFLOW : HIDDEN;
}

DIV.POST_BODY A:LINK{ COLOR: #6C839E; TEXT-DECORATION: UNDERLINE }
DIV.POST_BODY A:VISITED{ COLOR: #6C839E; TEXT-DECORATION: UNDERLINE }
DIV.POST_BODY A:ACTIVE{ COLOR: #6C839E; TEXT-DECORATION: UNDERLINE }
DIV.POST_BODY A:HOVER{ COLOR: #B6B6B6; TEXT-DECORATION: UNDERLINE }

DIV.POST_TTL {
FONT-SIZE : 10PT; COLOR : #6C7F8C;
FONT-WEIGHT : BOLD;
}

DIV.POST_TAIL {
MARGIN: 20PX 0PX 10PX;
TEXT-ALIGN : RIGHT;
LINE-HEIGHT : 170%;
FONT-FAMILY : TAHOMA;
FONT-SIZE : 8PT;
}

DIV.COMMENT {
MARGIN-TOP : 10PX;
MARGIN-BOTTOM : 10PX;
BORDER : 1PX #464646 SOLID;
BACKGROUND : #242424;
PADDING : 15PX;
PADDING-TOP : 10PX;
}

DIV.COMMENT_BODY {
MARGIN-TOP : 6PX;
MARGIN-BOTTOM : 20PX;
LINE-HEIGHT : 130%;
}

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

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-SIZE : 10PT;
FONT-WEIGHT : BOLD;
MARGIN-BOTTOM : 10PX;
}

DIV.ARCHIVE_BODY {
MARGIN-BOTTOM : 100PX;
LINE-HEIGHT : 170%;
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.LOGO {
MARGIN-BOTTOM : 15PX;
}

DIV.BANNER {
MARGIN-TOP : 40PX;
MARGIN-BOTTOM : 10PX;
}

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

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

.SMALL {
FONT-SIZE : 8PT;
}

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


DIV.CAL_TOP {
}

DIV.CAL {
MARGIN-TOP : 30PX;
TEXT-ALIGN : CENTER;
}

DIV.CAL_HEAD {
WIDTH : 140PX;
FONT-SIZE : 8PT;
FONT-FAMILY : VERDANA;
TEXT-ALIGN : CENTER;
PADDING-TOP : 5PX;
PADDING-BOTTOM : 5PX;
MARGIN-BOTTOM : 10PX;
BACKGROUND : #222;
}

DIV.CAL_BODY {
WIDTH : 145PX;
FONT-SIZE : 8PT;
FONT-FAMILY : VERDANA;
TEXT-ALIGN : CENTER;
}

DIV.CAL_BOTTOM {
}

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

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

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

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

.CAL_TODAY {
FONT-FAMILY : VERDANA;
FONT-SIZE : 7PT;
FONT-WEIGHT : BOLD;
BACKGROUND : #222;
COLOR : #3D5586;
TEXT-ALIGN : CENTER;
}

.CAL_TR {}

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

[PR]
by asazuki508e | 2011-06-20 03:42 | Comments(0)