티스토리 표를 핸드폰에서 제대로 보이게

 티스토리를 하면서 크게 불편한 점은 없습니다만 제일 짜증 나는 것은 아무래도 반응형 스킨임에도 불구하고 PC에서는 제대로 보이는 표가 핸드폰에서는 깨져 보인다는 겁니다. 그 뿐만 아니라 표를 편집하기도 너무 어렵습니다. 좌우 넓이를 맞추다가 인내심이 폭발하기도 하는데 요즘에는 체념하고 엑셀에서 적당한 넓이로 붙여 넣기 후 선 및 면의 색 등을 조정하니 그럭저럭 쓸만 합니다. 이번 글에서는 반응형 티스토리 스킨을 쓰는 분들의 블로그에서의 표가 스마트폰에서도 잘 보이는 방법을 알려 드리겠습니다. HTML에서 살짝 변형만 주면 됩니다. 

 


저의 포스팅중에서 PC버전으로 볼때 표의 모양입니다. 이걸 그대로 휴대전화로 보면


절반이 짤리는 것을 볼수가 있습니다. 이 때 당황하지 마시고 티스토리 편집창으로 와서 'HTML'모드로 변환합니다. 




찾기로 'table'을 찾아 주면 위와 같은 문장이 나옵니다. 



위의 그림처럼 그 중에 중간에 있는 width="숫자" 를 지웁니다.



다시 한번 오른쪽 끝에 있는 width: 숫자px; 를  지워 줍니다.



이런 모양으로 문장이 남게 됩니다. 이렇게 두개의 문장만 지우고 발행을 눌러 주면



위와 같이 이쁘게 스마트폰에서 출력이 되는 것을 볼수 있습니다.


 이번 글에 쓴 방법은 스마트폰 뿐만 아니라 가끔 Pc 에서도 표가 짤려 보일 때 똑같이 적용되는 방법입니다.

Designed by JB FACTORY