블로그 가로 폭 변경하기

블로그 가로 폭 변경하기

블로그 가로 폭은 이미 설정을 통해 조절할 수 있습니다. 다만, 해당 기능은 전체적인 설정으로 세부적으로 가로 폭을 조절하기 위해서는 CSS 정의를 알맞게 수정해야합니다. 스킨 최대 가로 폭은 좌우 50px의 여백을 포함해 1400px이며 em 단위로 환산하면 100.000em입니다. 해당 설정은 정식 지원하는 기능이 아니지만, 최대 가로 폭보다 좁게 설정을 원할 경우 도움이 되는 안내입니다. 편의를 위해 단위는 px로 환산해 설정했습니다.

전체 가로 폭 설정하기

.row { width: 100%; margin: 0 auto; padding: 0 50px; max-width: 1024px }

스킨 최대 가로 폭보다 전체적으로 블로그 가로 폭을 좁게하고 싶다면 CSS 파일에서 02. Structure 정의 아래에 해당 정의를 찾아 알맞게 변경하세요. 해당 값을 변경하면 모든 페이지의 최대 가로 폭은 1024px로 설정됩니다. 스킨 옵션을 통해 사이드바1을 활성화하면 해당 설정으로 변경되지 않습니다. 설명서 카테고리에서 사이드바1 관련 글을 살펴보세요. 

첫 화면 가로 폭 설정하기

#tt-body-index .row { width: 100%; margin: 0 auto; padding: 0 50px; max-width: 1024px }

첫 화면의 가로 폭을 스킨 최대 가로 폭보다 좁게 설정하고 싶다면 위 정의를 CSS에 추가하세요. 티스토리는 각 페이지마다 고유 식별자를 제공하고 있습니다. 검색 페이지의 경우 식별자는 #tt-body-search입니다. 다만, 첫 화면 식별자는 공지사항 식별자와 동일하기 때문에 위와 같이 설정할 경우 공지사항 페이지도 동일하게 설정됩니다.

인덱스 페이지 가로 폭 설정하기

#tt-body-index .row, #tt-body-search .row, #tt-body-category .row, #tt-body-archive .row { width: 100%; margin: 0 auto; padding: 0 50px; max-width: 1024px }

인덱스 페이지는 첫 화면을 포함해 검색 페이지 및 카테고리 페이지 그리고 아카이브 페이지를 모두 포함합니다. 따라서 흔히 퍼머링크 페이지 및 방명록을 제외한 페이지입니다. 역시 위 정의를 CSS에 추가하면 원하는 결과를 얻을 수 있습니다.

이미지 맵

롤랑존

이미지를 활용해 다양한 기능을 제공하는 티스토리 반응형 스킨

    '지원' 카테고리의 다른 글

    글에 남긴 여러분의 의견은 14개 입니다.

    *

    *