티스토리 표 안에 이미지 자동 크기 조절 설정

 티스토리 블로그를 작성하면서 넣은 이미지는 별다른 설정을 하지 않아도 화면 크기가 작아지면 그에 맞춰 이미지의 크기도 자동으로 줄어들게 되어있다.

 하지만 표(테이블)는 따로 설정을 하지 않는 이상 화면이 작아져도 고정된 크기 그대로를 유지하기 때문에 반응형 스킨을 사용하고 있다면 html 코드를 수정하여 사용하는 것이 좋은데 문제는 표의 크기가 자동으로 조절되도록 코드를 수정하더라도 표 안에 이미지를 넣게 되면 이미지 크기가 고정되어 표까지 자동으로 줄어들지 않게 되다는 것이다.

티스토리 표 안에 이미지 자동 크기 설정

 평소에 이미지는 화면에 맞춰 자동으로 크기가 줄어들지만 표 안에 이미지를 넣는 경우에는 그렇지 않다.

 이런 경우 글을 작성할 때 표의 html 코드를 수정하면서 이미지를 삽입하는 부분의 html 코드도 같이 수정해주면 문제는 해결이 가능하다.

 하지만 매번 이렇게 하기도 번거롭고 또한 이미 작성한 다른 글들도 뒤늦게 문제를 발견하여 모두 수정을 해야 하는 상황이라면 css에 코드를 추가하여 일괄로 설정을 변경하는 것이 편할 것이다.

1. 스킨 html 편집.

 우선 티스토리의 관리자 화면 왼쪽 메뉴에서 꾸미기에 있는 스킨 편집을 클릭.

 스킨 편집 화면이 나타나면 html 편집 버튼을 클릭하도록 하자.

2. CSS 코드 추가.

 상단의 CSS 탭을 클릭한 뒤 아래의 코드를 적당한 위치에 추가하고 적용하도록 하자.

 (위치는 어디든 상관없지만 알아보기 쉽게 제일 아랫부분에 넣는 것이 좋지 않을까 한다.)

- 추가 코드. table {table-layout:fixed;}

그 외.

 해당 코드를 추가하게 되면 블로그에 추가한 모든 표가 영향을 받게 되기 때문에 표가 있는 글들은 문제가 없는지 체크해보는 것이 좋으며 사용하는 스킨에 따라서도 정상적으로 적용이 되거나 문제가 발생할 수도 있으니 역시나 블로그를 한 번씩 확인해보는 것이 좋을 것이다.

 (티스토리 블로그가 아니더라도 다른 사이트나 블로그에도 적용 가능하다.)