• 표(table) 만들기 2

    ’표(table) 만들기 1’에서 소개한 글에 이어 이번에는 좀 더 복작한 표를 만들어 보겠습니다. 표(table) 만들기 1 글 보기 : http://makebct.net/1635?cat=148 1. 표 삽입하기 ’표(table) 만들기 1’에서와 같은 방법으로 다음과 같은 표를 만들었습니다. 셀을 합치기 위해 해당 셀들을 선택 후, 에디터의 [표] > [셀] > [셀 병합]을 클릭하여 셀을 합쳐줍니다. 구분을 위해 에디터의 [표] > [셀] > [열 속성]을 이용하여 다음 그림과 같이 표를 만들었습니다. 2. 표를 정교하게 설정 위에서 만들어진 표에서 각 열의 가로폭을 지정하여 너비를 조정해 보겠습니다. 첫 번째 열 ’header 1’을 선택한 후, 에디터의 [표] > [셀] > [열 속성] 에서 폭을 15%로 지정합니다. 반응형에서 보여지는 걸 고려하여 가로폭은 %로 작성합니다. 위와 같은 방법으로 header 2를 제외한 header 1~5까지 각각의 너비를 %로 입력하였습니다. 이렇게하면 표 전체 너비 100%에서 나머지 Header 1, 3, 4, 5에 지정된 너비를 뺀 만큼 header 2에 해당하는 열 […]

  • 표(table) 만들기 1

    워드프레스에서 페이지나 글에 표를 삽입하려면 생각보다 어렵지요? 어떻게 설정해야 하는건지, 셀 크기부터 횡과 열 설정도 맘대로 안되고 여간 까다로운게 아닙니다. 이는 한글이나 워드 프로그램에서 표 작성이 습관화되어 더 어렵게 느껴지는 탓도 있을 겁니다. 이번 글에서는 간단한 표를 만들고 스타일을 적용해 보겠습니다. 에디터의 표 삽입 기능은 워드프레스 에디터 TinyMCE Advanced 플러그인에서 지원하는 표 기능입니다. 1. 표 삽입하기 ’글 작성화면’의 에디터에서 [표] 버튼을 클릭하여 일단 표를 삽입하겠습니다. 5X5 의 표를 삽입하였으나 아래 그림과 같이 표가 삽입되었습니다. 테두리 오른쪽 상자를 드레그하여 오른쪽으로 700px까지 늘립니다. 표 전체를 블록한 상태에서 에디터의 [표] > [표 속성]을 선택합니다. 반응형 테마에서 출력되므로 각 해상도에서 잘 보이도록 가로폭을 %로 설정하기위해 표의 가로를 100%, 세로를 auto로 입력합니다. 표의 첫 번째 줄에 Header 1 ~ 5까지 적어주고 이 부분을 block으로 감싼 후, 다시 에디터의 [표] > [열 속성]을 클릭합니다. 속성 설정에서 [고급]탭을 클릭하여 […]

위로이동