티스토리 표 모바일에 최적화 만들기

이번에는 모바일에서 표를 최적화 시키는 방법에 대해 알아 보겠습니다. 네이버 블로그는 pc에서 글을 쓰면 자동으로 모바일에서도 최적화되어 보여집니다 그러나 티스토리는 따로 작업을 해주셔야 합니다. 그렇지 않을 경우 모바일에서 보면 표가 잘려서 나타납니다. 아래 사진은 모바일에서 최적화 작업을 하지 않은 표 입니다. 표가 짤려 있는 걸 확인 할 수 있습니다.

이렇게 되면 힘들게 포스팅 작성 해도 모바일 사용자들에는 불편함을 주게 됩니다. 그럼 지금 부터 모바일에서도 표가 짤리지 않고 최적화 된 표를 만드는 방법에 대해 설명 드리겠습니다. 먼저 원하는 크기의 표를 그린 후 html창으로 들어 갑니다. 그럼 아래 사진의 소스를 볼수 있습니다.

여기서 유심히 봐야 할 부분은 첫 줄 <table class="txc-table" width="964" cellspacing="0" cellpadding="0" border="0" style= 입니다. 여기서 수정 해야 할 부분은 width="964"입니다. 이 부분을 아래 처럼 width="100%"로 수정 하면 됩니다.

  수정을 완료하고 모바일에서 확인해 보시면 수정된 표를 볼 수 있습니다.

동영상으로 확인 하고 싶으신 분은 아래 동영상을 확인해 주세요.

 

이상 티스토리 표 모바일에 최적화 만들기를 마치겠습니다. 읽어 주셔서 감사합니다.