soup_box[물고기결정]

soup.egloos.com
포토로그

이글루 스킨 소스 by 스프

각각의 설명을 달았기 때문에 바꾸실때도 찾기 쉬우실 겁니다.
모르시는 부분은 저에게 문의하시면 답변드리겠습니다.

main :

<div id="body">
<div id="USERMENU">
<!-- 로고 이미지인 soup_box는 바탕/bold/가로 90% 이미지로 되어있습니다. -->
<a href="http://soup.egloos.com"><img src=http://pds7.egloos.com/pds/200709/30/72/soup_box.gif class=Toplog align=absbottom><font size=2><font color=08b4ee>[물고기결정]</a>
<!-- 이글루 로고 끝 -->
<!-- 메뉴 시작 -->
　<span class=TopMENU>
        <a href="#menu" name="Top">Menu</a> | <a href="http://soup.egloos.com/3344715">Soup</a>
        | <a href="http://soup.egloos.com/category/놀이터">놀이터</a>
        | <a href="http://soup.egloos.com/category/잡동사니">잡동사니</a>
        | <a href="http://soup.egloos.com/category/재활용쓰레기 수거함" title="그림">재활용쓰레기 수거함</a>
        | <a href="http://soup.egloos.com/category/잘 살고있습니다.">잘 살고있습니다.</a>
        | <a href="http://soup.egloos.com/category/게임라이프">게임라이프</a>
        | <a href="http://soup.egloos.com/category/대나무숲" title="대부분 비공개">대나무숲</a>
        | <a href="http://soup.egloos.com/category/바통!">바통!</a></span><br><br>
<!-- 메뉴 끝 -->
<!-- 본문 -->
<div align="right" style="position:absolute; left: 759px; width: 230px; top: 42px;" class="ToMENU"><$adminmenu type=21$></div></div>
<div id=con><$post$>
<div style="left:0px; width: 889px;" class=page><center><$prepage$>　　<$nextpage$></center></div></div>
<div id="sidebar" style="left: 910px;">made in <a href="http://soup.egloos.com/">스프</a><br><$xml$></div>
<!-- 본문 끝-->
<!-- 하단메뉴 절취선 -->
<div class="mainview"><img src="http://pds6.egloos.com/pds/200709/30/72/mainview0.gif"></div>

<!-- 하단 메뉴를 숨길때 사용하세요.
<a onclick="this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';" href="javascript:void(0)"><div class="mainview"><img src="http://pds7.egloos.com/pds/200709/30/72/mainview.gif"></div></a><div class="left" style="DISPLAY: none"> -->

<!-- 하단메뉴 -->
<div id="sidebar">
      <div style="position:absolute; left:23px; width:150px;"><$logoimage$><$description$><a name="menu"></a><$calendar type=1$></div>
      <div style="position:absolute; left:187px; width: 800px;">
<$menuright$>        <!-- <$banner type=1$> --></div>
    </div></div>


본문

<DIV CLASS="POST">  
  <table border="0" cellspacing="0" cellpadding="0" width="968">
    <tr>
    <td colspan="3">
      <DIV CLASS=POST_HEAD>
          <table border=0 cellpadding=0 cellspacing=0 width=968>
            <tr>
            <td>
              <div class=POST_TTL><$postdate$>：<$postsubject$></div>
            </td>
              <td width=100 align=RIGHT><$postadmin type=5$></td>
          </tr>
        </table></div>
    </td>
  </tr>
  <tr>
    <td width="574" height="413">
      <div class="POSTbody" style="overflow: auto;"><div class="con"><$postcont$></div></div>
<div class=POST_TAIL><$posttail$> | <a href="#top"><font color=9400ff>#Top</font></a></div>
    </td>
      <td width="394" valign="top">
        <!-- 덧글 --><div class="cm"><$cmtjs$></div>
    </td>
  </tr>
</table>
</div>

오른쪽 메뉴 :
<div class="menu"><h3 class="posttitle"><$mntitle$></h3>
<div class="content"><$mnbody$></div></div>

Css :

#con div.POST div.POSTbody div.con img.image { margin-bottom: 12px; }
#con div.POST div.POSTbody div.con img.image_mid { margin-bottom: 12px; }
#con div.POST div.POSTbody div.con img.image_left { margin-bottom: 0px; margin-right: 11px; }
#con div.POST div.POSTbody div.con img.image_right { margin-bottom: 0px; margin-left: 11px; }

#con div.POST div.POSTbody div.con img.left { margin-bottom: 12px; margin-right: 11px; }
#con div.POST div.POSTbody div.con img.right { margin-bottom: 12px; margin-left: 11px; }

BODY {MARGIN: 0PX 0px 0px 0px; PADDING : 18PX 0px 0px 18px;
 scrollbar-3dlight-color:#F5F5F5;
 scrollbar-arrow-color:#F5F5F5;
 scrollbar-base-color:#F5F5F5;
 scrollbar-darkshadow-color:#F5F5F5;
 scrollbar-face-color:#FFFFFF;
 scrollbar-highlight-color:#FFFFFF;
 scrollbar-shadow-color:#F5F5F5;}

BODY,TD,DIV,LI{ FONT : 11px/150% 굴림,돋움,SANS-SERIF;}

A:LINK { TEXT-DECORATION: NONE;}
A:VISITED { TEXT-DECORATION: NONE;}
A:ACTIVE { TEXT-DECORATION: NONE;}
A:HOVER { TEXT-DECORATION: underline;}

/* onfocus="this.blur()" , hidefocus , 링크테두리 제거 */
a {selector-dummy: expression(this.hideFocus=true);}

/* 로고 이미지 */
img.Toplog { MARGIN-TOP : 0PX; MARGIN-BOTTOM : 0PX; MARGIN-RIGHT : 6px; BORDER : 0PX;}

span.TopMENU A:LINK{ COLOR: #ba32be; TEXT-DECORATION: NONE; }
span.TopMENU A:VISITED{ COLOR: #ba32be; TEXT-DECORATION: NONE; }
span.TopMENU A:HOVER{ COLOR: #FF8A00; TEXT-DECORATION: underline;}

div.ToMENU A:LINK{ COLOR: #ff3a82; TEXT-DECORATION: NONE; }
div.ToMENU A:VISITED{ COLOR: #ff3a82; TEXT-DECORATION: NONE; }
div.ToMENU A:HOVER{ COLOR: #FF8A00; TEXT-DECORATION: underline;}

/* 상단메뉴(Main | Valley | New Post | Config) 설정 */
DIV.USERMENU { MARGIN : 0px 0px 0px 0px;
 PADDING : 0px 0px 0px 0px;}

DIV.USERMENU A:LINK{ COLOR: #f26d7d; TEXT-DECORATION: NONE; }
DIV.USERMENU A:VISITED{ COLOR: #FF8A00; TEXT-DECORATION: NONE; }
DIV.USERMENU A:HOVER{ COLOR: #f26d7d; TEXT-DECORATION: NONE;}

/* 본문 설정 */
DIV.POST {PADDING : 0PX 0PX 30PX 0px;}

/* 본문 제목 */
DIV.POST_TTL {
 FONT-SIZE : 11px;
 COLOR : #692409;
 }
 
DIV.POST_HEAD {
 MARGIN-BOTTOM : 6PX;
 PADDING-TOP : 10PX;
 BORDER-BOTTOM : 1PX #BBB DASHED;
 }
 
DIV.POSTbody { width:100%; height:413px;
 MARGIN: 0PX 0PX 20PX 0PX;
 OVERFLOW : HIDDEN;
  FONT : 12px/125% 굴림,SANS-SERIF;
 PADDING : 7PX 0PX 7PX 7PX;
 COLOR : #747474;
}

DIV.POSTbody A:LINK{ COLOR: #8f939e; TEXT-DECORATION: NONE; }
DIV.POSTbody A:VISITED{ COLOR: #f17078; TEXT-DECORATION: NONE; }
DIV.POSTbody A:HOVER{ COLOR: #8f939e; TEXT-DECORATION: underline;}

div.con { FONT : 12px/125% 굴림,SANS-SERIF; MARGIN: 0PX 0PX 20PX 0PX; PADDING : 0PX 0PX 0PX 12PX; height:393px;}

/* 본문 내의 자주 사용하는 태그 속성 시작 */
div.con ul {
 list-style: none;
 margin-left: 0;
 padding-left: 0;
 }
div.con ul li {
 background: url(http://md.egloos.com/skn/pub/tp/img/templ_li_p003.gif) 0 4px no-repeat;
 padding-left: 10px;
 margin-bottom: 5px;
 }
div.con blockquote {
 margin: 10px 0;
 padding: 3px 10px 3px 10px;
 border-left: 7px solid #f5faf9;
 }

 

/* 본문 내의 자주 사용하는 태그 속성 끝 */
;
/* ☆ # by 작성자 | 작성시각 | 카테고리 | 덧글() */
DIV.POST_TAIL {
 FONT-FAMILY : VERDANA, TAHOMA, 돋움;
 FONT-SIZE : 11PX;
 MARGIN-TOP : 0PX;
 TEXT-ALIGN : RIGHT; 
 MARGIN-BOTTOM : 5PX; color: #747474;
 }

/* ☆ */
a.checkpost:LINK{ COLOR: #c34136; TEXT-DECORATION: NONE;}
a.checkpost:VISITED{ COLOR: #c34136; TEXT-DECORATION: NONE;}
a.checkpost:HOVER{ COLOR: #8ec63e; TEXT-DECORATION: NONE;}

/* # */
a.permalink:LINK{ COLOR: #c34136; TEXT-DECORATION: NONE;}
a.permalink:VISITED{ COLOR: #c34136; TEXT-DECORATION: NONE;}
a.permalink:HOVER{ COLOR: #8ec63e; TEXT-DECORATION: NONE;}

/* nick */
span.author { font-weight: bold; color: #76bafc;}

/* 0000/00/00 00:00 */
a.time:LINK{ COLOR: #f17078; TEXT-DECORATION: NONE; FONT-SIZE : 10px;}
a.time:VISITED{ COLOR: #f17078; TEXT-DECORATION: NONE; FONT-SIZE : 10px;}
a.time:HOVER{ COLOR: #ffba00; TEXT-DECORATION: NONE; FONT-SIZE : 10px;}

/* 카테고리 */
a.category:LINK{ COLOR: #8ec63e; TEXT-DECORATION: NONE; }
a.category:VISITED{ COLOR: #8ec63e; TEXT-DECORATION: NONE; }
a.category:HOVER{ COLOR: #ffba00; TEXT-DECORATION: NONE;}

/* 덧글 */
span.linkback A:LINK{ COLOR: #8f939e; TEXT-DECORATION: NONE; font-weight: bold;}
span.linkback A:VISITED{ COLOR: #8f939e; TEXT-DECORATION: NONE; font-weight: bold;}
span.linkback A:HOVER{ COLOR: #08b4ee; TEXT-DECORATION: NONE; font-weight: bold;}

/* 이글루 설명 */
a.logo{}

/*  메모장 */
div.memobody{}

/* 태그 */
div.tlevel1{}
/* ☆ # by 작성자 | 작성시각 | 카테고리 | 덧글() 끝*/

/* 코멘트 입력 폼 */
div.comment_input {
 MARGIN-TOP : 10PX;
 MARGIN-RIGHT : 0px;
 PADDING-TOP : 0PX;
 BORDER-TOP : 0PX #423C42 DOTTED;
 FONT-SIZE : 11px;
}

div.comment_input textarea { width: 328px !important; height: 50px !important; padding: 2px 0px 5px 6px;
                 MARGIN-TOP : 10PX; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid;
                 BACKGROUND-IMAGE : URL(http://pds1.egloos.com/pds/1/200602/15/72/comment BG.gif);
                 BACKGROUND-POSITION : left top;
                 BACKGROUND-REPEAT : NO-REPEAT;
                 border-color: #08b4ee;
                 border: 1px;
 scrollbar-3dlight-color:#FFFFFF;
 scrollbar-arrow-color:#006699;
 scrollbar-base-color:#FF6699;
 scrollbar-darkshadow-color:#FFFFFF;
 scrollbar-face-color:#FFCCCC;
 scrollbar-highlight-color:#FFFFFF;
 scrollbar-shadow-color:#FFFFFF;
}

DIV.comment_line { display:none;
 PADDING : 0px;
 HEIGHT : 0px;
 MARGIN : 0PX 0PX 0PX 0px;
 BORDER-TOP : 1PX #423C42 DOTTED;
 }

/* 덧글 */
div.cm { left: 10px; top: 0px; width:100%; height:463px; overflow: auto;}
div.track_top {margin-top:13px; BORDER-bottom : 1PX #cccccc DOTTED;}

div.comment { width: 338px;
 BACKGROUND : #fefefe;
 PADDING : 5PX 0PX 0px 10px;
 MARGIN : 10PX 0px 0px 10px;
 BACKGROUND-IMAGE : URL(http://pds1.egloos.com/pds/1/200602/17/72/comment.gif);
 BACKGROUND-POSITION : ;
 BACKGROUND-REPEAT : no-REPEAT;}

/* 덧글 내용 */
div.comment_body {
 MARGIN : 0PX 0PX 0PX 0px;
 LINE-HEIGHT : 150%;
 COLOR : #c34136;
 FONT-SIZE : 11px;
}

/* 덧글쓴사람,시간 */
div.comment_tail {
 MARGIN : 15PX 0PX 0PX 6px;
 PADDING : 0PX PX 0px 0px;
 FONT-FAMILY : VERDANA, TAHOMA, 돋움;
 FONT-SIZE : 11px;
 COLOR : #f17078;}

div.comment_tail A:LINK{ COLOR: #c34136; TEXT-DECORATION: NONE; }
div.comment_tail A:VISITED{ COLOR: #c34136; TEXT-DECORATION: NONE; }
div.comment_tail A:HOVER{ COLOR: #08b4ee; TEXT-DECORATION: NONE;}

/* 시스템에관한 클래스 */
DIV.CMTJS A:LINK{ COLOR: #4d9db4; TEXT-DECORATION: NONE; }
DIV.CMTJS A:VISITED{ COLOR: #4d9db4; TEXT-DECORATION: NONE; }
DIV.CMTJS A:HOVER{ COLOR: #4d9db4; TEXT-DECORATION: NONE;}

div.page { COLOR : #8ec63e; font-size: 11px;}
div.page A:LINK{ COLOR: #f17078; TEXT-DECORATION: NONE; }
div.page A:VISITED{ COLOR: #f17078; TEXT-DECORATION: NONE; }
div.page A:HOVER{ COLOR: #FF8A00; TEXT-DECORATION: NONE;}

/* 하단 메인 보기버튼 */
DIV.mainview {left:19px; width:100%; margin-bottom:20px;}

/* 하단메뉴바(sidebar) style 시작 */
div.mn_ttl {
                font-family: 굴림,돋움,sans-serif;     
 color : #d4b152;
                font-weight : bold;
                font-size: 18px;
                margin-top: 0px;
 }

#sidebar div.menu {  text-align: left;  float: left; padding: 0px 15px 7px 10px;}

/* 로고,이글루설명 */
#sidebar p.logoimage {
 width: 150px;
 text-align: center;
 margin-bottom: 0px;
 }

#sidebar p.description {
 width: 150px;
 text-align: left;
 margin-bottom: 0px;
 }

/* 카테고리 포토로그 메모장 등등 */
/* 메뉴바 타이틀 */
#sidebar div.menu h3.posttitle {
 color : #a1756f;
 font-size: 12px;
 text-align: left;
 margin: 0px 0 10px 0;
 border-bottom: 1px solid #d4b152;
 }

#sidebar div.menu .content {
 list-style: none;
 padding: 0 0 0 0;
 margin: 0 0 0 0;
 text-align: left;
 }

DIV.menu .content A:LINK{ COLOR: #747474; TEXT-DECORATION: NONE;}
DIV.menu .content A:VISITED{ COLOR: #747474; TEXT-DECORATION: NONE;}
DIV.menu .content A:HOVER{ COLOR: #aaaaaa; TEXT-DECORATION: NONE;}

#sidebar div.menu ul.content li {margin-bottom: 0px; padding-bottom: 0px; color : #747474; font-size: 11px/100%;}
#sidebar div.menu ul.content li span.small { display: block; font-size: 10px; margin-bottom: 6px; margin-top: 0px; text-align: right; color : #aaa;}
#sidebar div.menu ul.content li span.last { }

#sidebar div.menu .content form#finder { margin: 0; }
#sidebar div.menu .content input#kwd { width: 100px; font-size: 11px; vertical-align: top; background: #; border: 1px solid #cccccc; height: 15px; }
#sidebar div.menu .content input#submit { margin-left: 5px; vertical-align: top; }

#sidebar div.menu .content div.lifelog, .sidebar div.menu .content div.lifelog { margin-bottom: 5px; }

#sidebar div.banner {margin: 0 auto; text-align: center;}
#sidebar div.xml { line-height: 80%; margin-right: 25px; margin-bottom: 10px; text-align: right; }
/* sidebar 스타일 끝 */

/* 달력 설정 시작 */
div.cal_top { display: none; }

div.cal A:LINK{ COLOR: #ff5999; TEXT-DECORATION: NONE; }
div.cal A:VISITED{ COLOR: #ff5999; TEXT-DECORATION: NONE; }
div.cal A:HOVER{ COLOR: #FF8A00; TEXT-DECORATION: NONE;}

div.cal { width: 150px; text-align: center; }

div.cal_head {
 width: 150px;
 font-size: 11px
 line-height:1.5em;
 font-family: verdana, tahoma, serif;
 text-align: center;
 padding: 4px 0px;
 margin-top: 10px;
 border: 1px solid #f6e4d6;
 border-bottom: none;
 background-color: #fff;
 }

div.cal_body {
 width: 150px;
 text-align : center;
 border: 1px solid #f6e4d6;
 border-top: none;
 background-color: #fff;
 margin-bottom: 25px;}
.cal {
 font-size: 10px;
 line-height: 1.4em;
 font-family: verdana, tahoma, serif;
 letter-spacing:.1em;
 color: #9f9f9f;
 }
.cal_day {
 font-weight: bold;
 font-size: 10px;
 line-height: 1.5em;
 font-family: verdana, tahoma, serif;
 color: #96c2b5;
 }
.cal_sun {
 font-weight: bold;
 font-size: 10px;
 line-height: 1.5em;
 font-family: verdana, tahoma, serif;
 color: #0092bc;
 }
.cal_sat {
 font-weight: bold;
 font-size: 10px;
 line-height: 1.5em;
 font-family: verdana, tahoma, serif;
 color: #ffg999;
 }
.cal_today {
 font-weight: bolder;
 font-size: 10px;
 line-height: 1.5em;
 font-family: verdana, tahoma, serif;
 color: #08b4ee;
 background-color: #fff;
 }
/* 달력 설정 끝 */

태그 : , ,

포스트 메타 정보

퍼블리싱 및 추천

같은 카테고리의 글

덧글(14)

덧글

  • Ηellă 2007/12/23 18:14 # 답글

    와 항상 예쁘다 탐만 내고 있던 소스인데.. 가져가서 열심히 연구해 보겠습니다!

  • 로빈 2007/12/23 20:23 # 답글

    와 드디어...
    감사합니다~
    크리스마스 선물같아요~ ^^

  • 푸른새벽 2007/12/26 05:18 # 답글

    상냥한 스프님... +_+

  • 코랄코털 2008/01/10 17:46 # 답글

    와 블로그가 홈페이지같아요'ㅂ'!!!;;대단하시다!!;;
    저도 써도 될까요?

  • 2008/04/24 09:20 # 답글

    비공개 덧글입니다.

  • 속깊은이유 2008/06/08 21:18 # 답글

    저도 써도 되나요 스프님?
    예쁘네요^^

  • 2008/06/08 21:49 # 답글

    비공개 덧글입니다.

  • 스프 2008/06/15 22:54 # 답글

    다음 스킨은 사용하기도 응용하기도 쉬운 걸로 해봐야 겠어요 ^^

  • PGP-동호 2008/07/29 04:36 # 답글

    으음;; 이제 이것을 가져간후의 나머지는 제게 달렸군요;;
    좋은 스킨이군요 바로 참조하도록 해야겠습니다~
    2005년부터 블로그 이렇게 사용하고 싶었는데;;

  • Despild 2008/07/29 05:13 # 답글

    잘 쓰겠습니다^^

    편집을 더 하려니 힘들긴 하지만 그래도 감사해요^^

  • soup 2008/07/29 05:30 # 답글

    궁금하신 건 언제든지 물어봐 주세요.^-^

  • Despild 2008/07/29 06:03 # 답글

    음... 사이드 바가 제대로 안나오는데 왜일까요...ㅡㅡ;;

  • Despild 2008/07/29 06:11 # 답글

    아 해결했어요 ^^;;

  • soup 2008/07/29 07:07 #

    해결하셨다니 다행이네요.

    혹여라도 다른 분들이 보고 궁금증을 가지실 수 있으니 적어놓습니다.

    제 스킨의 CSS속성 중 좌측기준으로 가로배열을 하는 Float : Left 속성은 상위에 틀(크기)을 잡아줄 만한 Table이나 div가 있어야 제대로 배열이 된답니다.
덧글 입력 영역

프로필

※ 배너가 필요하신 분은 위의 배너를 이용해주시기 바랍니다.by soup

카테고리

포토로그

제작과정
블로그내 검색 영역
soup.egloos.com is powered by Egloos. Subscribe to RSS.. Skin designed by egloos.