티스토리(tistory.com) 스킨 조정

- 스킨 편집, style.css, style.html



//====================================================

- style.css

/* 블로그 레이아웃 */
/* wrapContainer */

#container {    /*전체 크기 조정*/
  width:/*@post-width=*/960px/*@*/;
    height: 100%; background: #fff;
}


#content {    /*본문*/
    float:left;
    padding: 10px 10px 10px 10px;/*Top Right Bottom Left */
    width:/*@post-width=*/730px/*@*/;
    overflow:hidden;
}


/* ***** Header ***** */
#header .blogTitle {    /*타이틀*/

    width:/*@post-width:290=*/920px/*@*/; height: /*@title-height=*/109px/*@*/;
    background: /*@title-background-color=*/transparent /*@*/ /*@title-background-image=*/url(images/topbg_img.gif) /*@*/ /*@title-background-image-repeat=*/repeat/*@*/ /*@title-background-image-position=*/center center/*@*/;

}




//==========================================================

* 본문 글자 크기, 색 조정


style.css


...


.article {
  margin: 36px 0 0 0; overflow:hidden;
  /*@post-body-color=:#666666;*/color: #666666;/*@*/
  /*@post-body-font-family=:;*/font-family: dotum;/*@*/
  font-size: 11pt;// 글자 크기 조정 <----
  color:#000000;//색깔조정 <---
}


//참고

CSS Colors

CSS Color Names


//====================================================================

* 티스토리 카테고리 메뉴 항상 펼치기
    - Tistory관리 -> HTML/CSS 편집 -> skin.html 수정

<!-- 카테고리 모듈 -->
                                <div id="category">
                                    <h3>카테고리</h3>
                                    [#.#_category_#.#]
                                </div>
<!-- 카테고리 펴기 추가-->
<script language="JavaScript">try{expandTree();}catch(e){}</script>



//====================================================================

* 구글 맞춤 검색을 사이드바에 추가


<div id="sidebar">


<!--맞춤검색1 //-->
<form action="http://www.google.co.kr" id="cse-search-box">
  <div>
    <input type="hidden" name="cx" value="partner-pub-7609282398200521:3270550901" /><!-- 부여받은 코드 -->
    <input type="hidden" name="ie" value="UTF-8" />
    <input type="text" name="q" size="20" />

<!-- 버튼 크기 조정 -->

    <input type="submit" name="sa" value="&#xac80;&#xc0c9;" style="width: 35px; height: 23px;" />
  </div>
</form>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("elements", "1", {packages: "transliteration"});</script>
<script type="text/javascript" src="http://www.google.com/cse/t13n?form=cse-search-box&t13n_langs=en"></script>

<script type="text/javascript" src="http://www.google.co.kr/coop/cse/brand?form=cse-search-box&amp;lang=ko"></script>


                        <s_sidebar>



반응형

'Tips' 카테고리의 다른 글

VirtualBox(버츄얼박스) 사용법  (2) 2013.11.23
DosBox 사용법  (0) 2013.11.23
Find & Replace Tool  (0) 2013.11.03
windows 탐색기에서 "새로 만들기" 항목 추가  (0) 2013.10.21
베가스(Sony Vegas Pro) 사용 팁  (5) 2013.10.07
Posted by codens