부트스트랩 테이블을 배우기로 했다.

지금 티스토리 에디터에 있는 테이블 기능은 좋지만 반응형 스킨을 사용하는 사람과 반응형 스킨에 포함된 모바일웹 스킨을 사용하는 사람에게는 기피하게 될 것이다. 왜냐하면 화면을 줄이면 테이블을 잘리기 때문이다. 만약 PC에서 이 글을 본다면 화면을 줄였으면 한다.  스마트폰 등 다앙한 모바일 기기 화면에서 어떻게 보일지 보고 싶다면 http://troy.labs.daum.net/를 클릭해도 된다. 아래 테이블은 티스토리 에디터로 만든 것으로 100% 잘린다. 위 테이블에서 글 영역에서 테이블이 벗어나는 이유는 내가 스킨을 잘못 만들었다. 다른 스킨에서는 벗어나지 않는다. 

만물은 구하지 하는 아름다우냐?	무엇을 밥을 같으며, 못할 오아이스도 아니다	우리의 원대하고, 그들의 풍부하게 이것이다.
만물은 구하지 하는 아름다우냐?	무엇을 밥을 같으며, 못할 오아이스도 아니다	우리의 원대하고, 그들의 풍부하게 이것이다.
만물은 구하지 하는 아름다우냐?	무엇을 밥을 같으며, 못할 오아이스도 아니다	우리의 원대하고, 그들의 풍부하게 이것이다.

그러나 티스토리에서 제공한 모바일웹 스킨을 사용하면  위 테이블은 잘리지 않는다. 얼마 전까지는 티스토리가 제공한 모바일웹에서도 잘렸는데 새로 제공한 모바일웹 스킨에서는 잘리지 않고 스크롤하면 된다. 몇 년 전에 모바일웹 스킨에서 테이블이 잘렸기 때문에 잘리지 않게 하기 위해 MS 워드에서 테이블을 만들었다. 워드에서 테이블을 만들고 캡처해서 이미지로 삽입했다. 참고로 워드에서 테이블 기능이 좋았다.  

그래서 반응형 스킨에서도 잘리지 않는 테이블을 만들기 위해 부트스트랩 테이블 CSS를 배우기로 한 것이다. 이 블로그 스킨은 부트스트랩이다. 그러니 부트스트랩 테이블...HTML 테이블 태그로 테이블를 만들기 찮고 인터넷에 테이블을 자동으로 만들어주는 사이트가 있으니 http://truben.no/table/을 이용하기 했다. 그곳에서 테이블을 만든 후 부트스트랩 테이블 CSS를 적용하면 될 것이다. 

가령 테이블 기본을 만들어 table 태그에 class="table"을 추가하면 아래와 같은 부트스트랩 기본 테이블이 만들어진다. PC라면 브라우저 크기를 줄여도 잘리지 않는다. 나머지 부트스트랩 테이블 CSS에 있는 색 있는 행, 테두리 선 등은 천천히  배우려 한다. 반응형 스킨에 포함된 모바일웹 스킨에 HTML/CSS를 사용할 수 있으니 모바일에서도 부트스트랩 테이블을 볼 수 있다.

유소년에게서 우리의 뛰노는 바이며, 놀이 힘있다	유소년에게서 우리의 뛰노는 바이며, 놀이 힘있다	유소년에게서 우리의 뛰노는 바이며, 놀이 힘있다	유소년에게서 우리의 뛰노는 바이며, 놀이 힘있다
우리의 원대하고, 그들의 풍부하게 이것이다.	우리의 원대하고, 그들의 풍부하게 이것이다.	우리의 원대하고, 그들의 풍부하게 이것이다.	우리의 원대하고, 그들의 풍부하게 이것이다.
우리의 원대하고, 그들의 풍부하게 이것이다.	우리의 원대하고, 그들의 풍부하게 이것이다.	우리의 원대하고, 그들의 풍부하게 이것이다.	우리의 원대하고, 그들의 풍부하게 이것이다.

지금 에디터가 2012.3.27에 추가와 삭제 등을 거쳐 생긴 것으로 아는데, 조만간 모바일 기기에 최적화된 에디터가 필요할 것 같다는 생각이 든다.