반응형 Book Club 스킨2 [티스토리 블로그] 썸네일 다루기 심화편 ③ 커버 썸네일 수정 여기서 다루는 내용은 Book Club 스킨에 한정합니다. 스킨마다 구조가 다르기 때문에 반드시 확인하셔야 합니다. 심화편 ①에서는 각 설정별 구조를 살펴보았고, ②에서는 기본 목록의 썸네일 이미지를 조정하는 법을 살펴보았습니다. 이번에는 관리>스킨편집>홈설정이 커버일 때 커버 아이템별로 썸네일 이미지를 조정하는 방법을 살펴보겠습니다. 심화편 ①에서 찾은 커버 아이템별 HTML 구조는 다음과 같습니다. 섬네일리스트 뉴스레터 커버갤러리1 커버갤러리2 첫 화면 div.cover-thumbnail-1>ul>li>a>figure>img div.cover-thumbnail-2>ul>li>a>figure>img div.cover-thumbnail-3>ul>li>a>figure>img div.cover-thumbna.. 2021. 8. 5. [티스토리 블로그] 썸네일 다루기 심화편 ② 기본 목록 여기서 다루는 내용은 Book Club 스킨에 한정합니다. 스킨마다 구조가 다르기 때문에 반드시 확인하셔야 합니다. 지난번 썸네일 다루기 심화편 ①에서 환경 설정에 따른 스킨의 구조를 살펴보았습니다. 그 내용을 토대로 오늘은 기본 목록 썸네일에 대해 자세히 살펴보도록 하겠습니다. 관리 메뉴 중 스킨편집에서 홈설정이 최신글(목록+내용)인 경우와 블로그의 기본 목록에서의 썸네일은 구조가 동일하다는 것을 알 수 있었습니다. div.post-item>a>span.thum>img 이것이 기본 구조였죠. 썸네일 사이즈를 제어하는 것은 어떤 부분인지 자세히 살펴보겠습니다. CSS 부분을 살펴보면, span.thum 요소는 부모 요소에서 넓이를 제어하고 높이는 0으로 잡아두고 실질 높이는 padding-bottom으로.. 2021. 7. 28. 이전 1 다음
