genieU's studying

티스토리 사이드바 크기(너비,폭), 배경색(글자색), 테두리, 고정 변경하기

genieU89 2018. 8. 21. 14:12

티스토리 블로그를 시작하는 분들이라면 한 번쯤은 정형화 된 기본 스킨을 나만의 스타일로 바꾸고 싶다고 생각할 것입니다. 또 구글 애드센스를 시작하게 되면 사이드바의 크기, 배경색, 배치 등을 조정해야 할 필요성을 느끼게 됩니다. 근데 막상 바꾸려고 스킨 편집을 누르는 순간 암호도 아닌 것이 수많은 영어들로 속이 울렁거리기 시작하지 않으셨나요? 저도 처음 스킨 편집 들어갔을 때 한 1분 정도 멍하니 보다가 살포시 나와서 다시 폭풍 검색 후 시행착오 끝에 지금의 제 사이드 바의 모습을 갖추었습니다. 


 그래서 오늘은 제가 사용하고 있는 반응형 스킨 'Square'의 사이드바의 크기(너비,폭), 배경색(글자색), 테두리, 고정 유무 등 사이드바 꾸미는 방법에 대해서 포스팅 해보고자 합니다.  


HTML/CSS를 전~혀 몰라도 무작정 따라하면 되는거니깐 팔로팔로 미~



사이드바의 크기(너비,폭), 배경색(글자색), 테두리, 고정 유무 변경 방법


1. 블로그관리 → 스킨편집 → html편집


2. CSS 클릭 → ctrl+f(탐색) → 'sidebar'

css클릭 후 ctrl+f 키를 눌러 sidebar를 검색해 줍니다. 그럼 아래와 같이 주황색으로 표시가 나타납니다.



3. 빨간 박스 안에서만 조절해 주면 크기(너비,폭), 배경색(글자색), 테두리, 고정 변경할 수 있습니다.

더 자세히 설명 드리면 아래와 같습니다.

  • position: fixed;(사이드바 고정) 

  • position: absolute;(본문과 함께 이동)

  • width: 300px(사이드바 너비값)

  • background-color: #fff;(사이드바 배경색)

  • border-right: 1px; solid #ddd;(사이드바 테두리 굵기와 색)

☞지니의 꿀팁
색상표는 네이버에 '색상표'를 검색하면 값이 나옵니다. 원하는 색상 값을 기입하면 됩니다.


이래도 이해가 안가신다고 하면 아래 동영상을 참조 하시면 더 이해가 빠르실 꺼예요.



포스팅 내용이 조금이나마 도움이 되셨다면 

"좋아요 또는 댓글"

달아주시면 저에게 큰 힘이 됩니다.^^



모바일 광고 플랫폼 텐핑 "1인 마케팅 기업 시대 연다"
마케팅 어려우신가요? 딱 20분께만 알려드리는 수익 노하우
자동차코일매트 최저가? 클렉스카매트!