슥슥 끄적

지금 사용하고 있는 스킨([기본테마스킨 - tisNote ]) 수정

파드파드 2007. 9. 20. 14:38
반응형
사용자 삽입 이미지
[기본테마스킨 - tisNote ]
지금 사용하고 있는 거는 색깔도 나름 변경한 스킨이다.

아래는 지금 사용하고 있는 스킨의 style.css에서 발췌 한 코드이다.






/* 블로그의 레이아웃 */
.container{ width:1000px;}
 .header{ width:780px; padding:10px;}
  .header h1{ float:left;}
  .header .rss{ text-align:right;}
 .Body{ margin-right:6px;}
 .Body .layoutMiddle{ background:url(./images/bodyMiddle.gif) repeat-y;}
 .Body .layoutTop{ background:url(./images/bodyTop.gif) no-repeat top;}
 .Body .layoutBottom{ background:url(./images/bodyBottom.gif) no-repeat bottom;}
  .mainBody{ float:left; width:800px; background-color:#fff; padding:0; margin:0;}
  .mainBody .layoutMiddle{ background:url(./images/mainBodyMiddle.gif) repeat-y;}
  .mainBody .layoutTop{background:url(./images/mainBodyTop.gif) no-repeat top;}
  .mainBody .layoutBottom{background:url(./images/mainBodyBottom.gif) no-repeat bottom; padding:10px;}      
   .blogmenu{ background-color:#6495ed; border-bottom:2px solid #4169e1; padding:5px 5px 2px 10px;}
    .blogmenu .menu{ float:left; padding-top:5px;}
    .blogmenu .search { margin-left:550px; text-align:right;}
   .contentBody{ width:780px; border-top:5px solid #ededed;} 
   .contentBody .layoutMiddle{ padding:0; margin:0; background:url(./images/contentBodyMiddle.gif) repeat-y;}
   .contentBody .layoutTop{ padding:0; margin:0; background:url(./images/contentBodyTop.gif) no-repeat top;}
   .contentBody .layoutBottom{ padding:0; margin:0; background:url(./images/contentBodyTop.gif) no-repeat bottom;}    
    .content { float:right; width:585px; margin:5px 0 5px 5px; padding:0;}
    .content .layoutMiddle{ padding:0; margin:0; background:url(./images/contentBodyMiddle.gif) repeat-y;}
    .content .layoutTop{ padding:0; margin:0; background:url(./images/contentBodyTop.gif) no-repeat top;}
    .content .layoutBottom{ padding:0; margin:0; background:url(./images/contentBodyBottom.gif) no-repeat bottom;}  
    .sideinfo{ float:left; border:5px solid #ededed; border-top:0; padding:5px; width:170px; overflow:hidden;}
  .sideinfoEtc{ float:left; margin:40px 0 0 6px; width:154px; padding:10px; background-color:#f5f5f5; overflow:hidden;}
 .footer{ width:740px; padding:20px; text-align:center; clear:both;}
=> 여기는 말 그대로 레이아웃.


/* content > entryNotice, entryProtected, entry 본문 */
.content .article{ margin:10px; width:560px; overflow:hidden; letter-spacing:0;}
=> 이 부분은 본문글이 출력되는 부분이다.

=========================================================================================

저 두분에서 width를 조정하면 스킨의 넓이를 조정할 수 있다.

본문 부분이 좁아서 사용하기에 불편했다. 그래서 스타일시트 뒤적 거려서 30px(오 방금전에
발견. 습관대로 볼드체는 ctrl+B 하니까 적용된다. 해제도 되고 내만 몰랐던거여?) 늘렸다.

더 넓혀 보려 했으나(원래는 200px 넓힐려고 했음) 1024를 넘어가기에, 1024해상도를 쓸수 있는 사람도 있으니 30px만 확장했다.
업무페이지는 맨날 1024로만 하는데, 사람들은 자기 컴 해상도를 어느정도로 쓰고 있을까?


p.s
지금 사용하고 있는 스킨 이미지 가져올라고, 스킨 페이지 가니까, 스킨 수정 할 수 있는
기능(스킨위자드)이 추가가 되었더라. 언제 생겼지.
오늘도 삽질을 하지.


반응형