tomemo

スキン「お花見」を右サイドバー化するためのHTML/CSS -青空-

スキン「お花見」を右サイドバー化するためのHTML/CSSの青空バージョンです。





HTML


<div id="top">
<div class="HEADER"><$header$></div>
<div class="URL"><$blogurl$></div>
<div class="top2">
<table width="750" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="bottom">

</td>
<td valign="bottom">
<div class="garbo_link">
<a href="http://woman.excite.co.jp/garbo/" target="_blank">
<img src="http://md.exblog.jp/skn/img/a/01/03/4/tr.gif" alt="Garbo[ 大人の女の贅沢主義 ]" height="35" width="145" border="0" />
</a>
</div>
</td>
</tr>
</table>
</div>
</div>
<div id="main">
<table border="0" cellspacing="0" cellpadding="0">
<tr valign="top">
<td width="550">
<div id="center">
<$post$>
<div class="pagenext">
<span class="pagenext2"><$prepage type=1$></span>
<span class="pagenext2"><$nextpage type=1$></span>
</div>
</div>
</td>
<td width="200" align="left">
<div id="left">
<div class="USERMENU"><$adminmenu type=1$></div>
<div class="PROFILE">
<$logoimage type=1$>
<div class="profile_body"><$description$></div>
<div class="nick"><$nick$></div>
</div>
<$calendar type=1$>
<div class="MN"><$menuleft$></div>
<$banner type=1$>
<$xml$>
</div>
</td>
</tr>
</table>
</div>


CSS


/* excite blog skin css */

BODY { background: white url(http://md.exblog.jp/skn/img/a/01/03/4/h_bodybg3.gif); margin: 0px; padding: 0px }
BODY,TD,DIV,LI { color: #555; font-size: small; line-height: 140%; font-family: "ヒラギノ角ゴ Pro W3", Osaka, ARIAL, SANS-SERIF ;word-break:break-all;}

A:LINK { color: #4f99d4; text-decoration: none }
A:VISITED { color: #4f99d4; text-decoration: none }
A:ACTIVE { color: #f90; text-decoration: none }
A:HOVER { color: #f90; text-decoration: underline }

BLOCKQUOTE { margin: 16px; padding: 10px; border: solid 1px #b8d3f5 }
#top { background: url(http://md.exblog.jp/skn/img/a/01/03/4/h_header_img3.jpg) no-repeat; text-align: center; margin-right: auto; margin-left: auto; width: 750px; height: 280px }
.top2 { margin-top: 8px }
#main { background-color: #ffffff; text-align: center; margin-right: auto; margin-left: auto; padding-top: 6px; width: 750px }
#center { text-align: left; padding-right: 15px; padding-left: 15px }
#left { text-align: left; margin-left: 15px; width: 180px }

.garbo_link { text-align: right; margin: 0px }
.pagenext { text-align: center; margin-bottom: 60px }
.pagenext2 { margin-right: 30px; margin-left: 30px }

DIV.HEADER { font: bold 22px/100% "ヒラギノ角ゴ Pro W3", Osaka, ARIAL; text-align: left; padding-top: 16px; padding-right: 14px; padding-left: 14px }

DIV.HEADER A:LINK { color: #fff; text-decoration: none }
DIV.HEADER A:VISITED { color: #fff; text-decoration: none }
DIV.HEADER A:HOVER { color: #a7dff5; text-decoration: none }

DIV.URL { font: 11px/100% Verdana; text-align: left; margin-top: 3px; padding-right: 14px; padding-left: 16px }
DIV.URL A:LINK { color: #fff; text-decoration: none }
DIV.URL A:VISITED { color: #fff; text-decoration: none }
DIV.URL A:HOVER { color: #a7dff5; text-decoration: underline }
DIV.USERMENU { color: #808080; font: 10px/100% Osaka, Verdana; text-align: center; padding: 0 0 15px;}
DIV.USERMENU A:LINK { color: #808080; text-decoration: none }
DIV.USERMENU A:VISITED { color: #808080; text-decoration: none }
DIV.USERMENU A:HOVER { color: #f90; text-decoration: underline }

DIV.PROFILE { text-align: center; border: solid 1px #c0c0c0; width: 180px; overflow: hidden }
.profile_body { line-height: 120%; text-align: left; margin-top: 5px; margin-right: 10px; margin-left: 10px }
.nick { color: #808080; font-size: 10px; font-family: Verdana; text-align: left; margin-top: -14px; margin-bottom: 6px; margin-left: 12px }

DIV.MN { text-align: left }
DIV.MNTTL { color: #fff; font-weight: bold; font-size: 10px; background: url(http://md.exblog.jp/skn/img/a/01/03/4/h_mnttlbg3.jpg) no-repeat; margin: 20px 0px 8px; padding: 2px 0px 2px 5px; width: 180px }
.mnbody { text-align: left ; overflow: hidden ;}
DIV.MEMOBODY { width: 180px; overflow: hidden }

DIV.POST { text-align: left; margin-bottom: 30px; margin-left: 15px; padding-bottom: 30px; border-bottom: 1px dotted #c0c0c0 }
DIV.POST_HEAD { margin-top: 2px ; overflow: hidden ;}
DIV.POST_DATE { color: #3a74ae; font-size: 11px; font-family: "ヒラギノ角ゴ Pro W3", "MS ゴシック", Verdana; background-repeat: no-repeat; margin-bottom: 10px; margin-left: 2px }
DIV.POST_TTL { color: #369; font: bold 16px/130% "ヒラギノ角ゴ Pro W3", Osaka, ARIAL, SANS-SERIF }
DIV.POST_ADMIN { font-size: small; text-align: right }
DIV.POST_BODY { line-height: 1.5; margin-bottom: 10px; width: 500px; overflow: hidden }
DIV.POST_TAIL { font: 10px/150% Verdana; text-align: right; margin-top: 16px; width: 500px }

DIV.COMMENT { background: url(http://md.exblog.jp/skn/img/a/01/03/4/h_cmmtbg3.jpg) no-repeat; margin-top: 8px; margin-right: 0px; margin-bottom: 8px; padding: 10px 12px; border: solid 1px #a7dff5 }
DIV.COMMENT_BODY { line-height: 130%; margin-bottom: 14px ; overflow: hidden ;}
DIV.COMMENT_TAIL { color: #777; font: 10px/150% Verdana; margin: 8px 0px 5px }
DIV.COMMENT_INPUT { margin-top: 20px; padding-top: 20px; border-top: 1px dotted #a7dff5 }
DIV.COMMENT_LINE { margin: 8px 0px 10px; border-top: 1px dotted #a7dff5 }



DIV.TRACK_TOP { line-height: 150% }
DIV.ARCHIVE_HEAD { font-weight: bold; margin-bottom: 10px }
DIV.ARCHIVE_BODY { line-height: 160%; margin: 20px 0px; padding-bottom: 100px }

IMG.IMAGE_TOP { margin-bottom: 15px }
IMG.IMAGE_LEFT { margin-right: 15px; margin-bottom: 15px }
IMG.IMAGE_RIGHT { margin-bottom: 15px; margin-left: 15px }
IMG.IMAGE_MID { margin-top: 15px; margin-bottom: 15px }
IMG.BOOKMK { margin: 10px; border: 0px }
IMG.USERMENU { margin-left: 8px }
IMG.LOGO { margin-top: 10px }

DIV.BANNER { text-align: center; margin: 30px 0px 10px }

.SMALL { font-size: 11px }
.DATE { font: bold 10px/150% Verdana }
.TIME { font: 10px/150% Verdana; text-align: left }
.AUTHOR { font: bold 10px Verdana }
.TXTFLD { color: #000; font-size: 12px; background-color: #fff; border: solid 1px #666678 }
.SUBMIT { color: #000; font: 12px/140% }

DIV.CAL_TOP { }
DIV.CAL { text-align: center; margin: 20px 0px; width: 180px }
DIV.CAL_HEAD { font: 10px/150% Verdana; background: url(http://md.exblog.jp/skn/img/a/01/03/4/h_mnttlbg3.jpg) no-repeat; text-align: center; margin-bottom: 10px; padding-top: 2px; padding-bottom: 2px; width: 180px }
DIV.CAL_HEAD A:LINK { color: #fff }
DIV.CAL_HEAD A:VISITED { color: #fff }
DIV.CAL_BODY { text-align: center; width: 180px }
DIV.CAL_BOTTOM { }

.CAL { font: 9px/170% Verdana; text-align: center }
.CAL_DAY { font: bold 9px/170% Verdana; text-align: center }
.CAL_SUN { color: #c69; font: bold 9px/170% Verdana; text-align: center }
.CAL_SAT { color: #545fa1; font: bold 9px/170% Verdana; text-align: center }
.CAL_TODAY { color: #808080; font: bold 9px/170% Verdana; background-color: #cce7f5; text-align: center }
.CAL_TR { }

DIV.XML { font: 10px/150% Verdana; text-align: center; margin-bottom: 50px }

[PR]
by asazuki508e | 2011-06-25 08:38 | Comments(0)