본문 바로가기

IT/Fastboot

[FastBoot]05.사이드바와 본문 너비 조정하기


'[FastBoot]04.사이드바와 본문 좌우 위치 바꾸기' 포스팅을 읽으셨다면 사이바와 본문 너비를 조정해보겠습니다. FastBoot 사이드바와 본문 너비가 현재 마음에 드시면 이 포스팅은 패스하셔도 됩니다. 이 역시 Bootstrap의 그리드(Grid)의 크기 12를 이해하시면 충분히 응용변경하실 수 있으십니다. 지금 현재 그리드 비율은 '본문 : 사이드바 = 9 : 3'입니다. 이 비율을 '본문 : 사이드바 = 8 : 4'로 바꾸어 보겠습니다.

· 답은 그리드 속에 있다


 첫번째, 본문의 그리드 9에서 8로 변경해봅시다. 찾기 단축기인 [Ctrl+f]를 눌러 [class="col-md-9"]를 찾아주세요. 그 다음 숫자 9를 8로 변경해주세요.

두번째, 사이드바의 그리드 3에서 4로 변경해봅시다. 찾기 단축기인 [Ctrl+f]를 눌러  [class="sidebar col-md-3"]를 찾아주세요. 그 다음 숫자 3을 4로 변경해주세요. 그렇게 한 다음 [저장]을 누르면 다음과 같이 본문과 사이드바의 너비가 조절되는 것을 확인 할 수 있습니다.



 이렇게 말이죠. 본인의 취향대로 바꾸시면 됩니다. 유의해야할 점은 본문과 사이드바의 그리드 수의 합이 '12'가 되어야 합니다. 저도 이렇게 Bootstrap을 배워보니 재미있네요. 같이 연구하며 여러분들만의 스킨을 꾸며보시길 바랍니다. 감사합니다:)



관련글


[FastBoot]04.사이드바와 본문 좌우 위치 바꾸기

[FastBoot]03.사이드바, 어디갔니?

[FastBoot]02.FastBoot 스킨등록 방법

[FastBoot]01.제 블로그 스킨은?

[Tistory Tip]브랜드 블로그의 첫걸음, 도메인

포스터 사진 Readiz Logo