※ 본 메뉴얼은 [시스템 레벨 : 개발자용] 으로 작성되어 있습니다.

( 개발자용이란? http://bos.kr/kwa-help_v-31 링크의 ⑧번을 확인해주세요 )



●DIV에 테이블 넣기

- 테이블 넣는 방법은 2가지가 있습니다.


첫번째. 테이블을 넣을 DIV의 ① D 아이콘 클릭 > ② 테이블 넣기를 클릭합니다.

 

 

두번째. 좌측에 테이블을 클릭해서 테이블을 생성합니다

(가장 상단에 테이블이 배치됩니다).

 



- 테이블 설정에서 각 원하는 속성을 입력합니다.

 

 

1) 테이블생성 : 행(가로줄갯수)과 열(세로줄갯수)을 지정할 수 있습니다.

> 3행 2열이면 가로 3줄과 세로 2줄의 테이블을 만들 수 있습니다.


2) 크기 : 가로와 세로 값을 주어 테이블 크기를 지정할 수 있습니다.

> 크기 100%를 주면 테이블을 감싼 DIV 크기의 테이블이 만들어집니다.


3) 라인/여백/간격 : 각 라인(선두께) / 여백(안여백) / 간격(칸간격)을 지정할 수 있습니다.

> 일반적으로 기본값 0으로 사용하며, 선 색상은 변경하지 못합니다.(단위 없이 숫자만 입력합니다)


4) 정렬 : 테이블의 위치를 지정할 수 있습니다.

> 가운데 속성을 주면 테이블을 DIV 가운데로 배치 할 수 있습니다.


5) 배경색 : 테이블 내의 배경색을 지정할 수 있습니다.

6) 배경이미지 : 테이블 내에 이미지를 첨부하여 배경으로 지정할 수 있습니다.

7) 테이블속성 : 테이블에 style 속성을 추가할 수 있습니다.




●칸(td) 설정

- 테이블의 각 칸의 T 버튼 마다 칸의 설정을 입력할 수 있습니다.


 

 

1) 크기 : 칸의 가로, 세로값을 주어 크기를 지정할 수 있습니다.

> 70,70을 입력하면 가로70px, 세로70px의 칸이 됩니다.


2) 정렬 : 칸 내의 컨텐츠(이미지, 텍스트 등)의 위치를 지정할 수 있습니다

> 가운데 속성을 주면 컨텐츠가 칸의 가운데에 배치가 됩니다.


3) 배경색 : 칸에 배경색을 지정할 수 있습니다

4) 배경이미지 : 칸의 배경이미지를 지정할 수 있습니다

5) 칸속성 : 칸에 style 속성을 추가 할 수 있습니다.

6) 가로병합 : 속성을 준 만큼 가로로 칸을 병합할 수 있습니다.

> 3의 속성을 입력한다면 가로로 3칸을 병합할 수 있습니다. 단, 병합해준 칸의 수 만큼 칸을 삭제해야 합니다.

> 가로 3칸을 병합했기 때문에 처음 속성을 준 칸을 제외한 오른쪽으로 밀린 칸 2개를 삭제해야 합니다.

> 또는 가로 병합을 주기 전 미리 2칸을 삭제 후 가로병합을 주어도 됩니다.


7) 세로병합 : 속성을 준 만큼 세로로 칸을 병합할 수 있습니다.

> 5의 속성을 입력한다면 세로로 5칸을 병합할 수 있습니다. 단, 병합해준 칸의 수 만큼 칸을 삭제해야 합니다.

> 세로 5칸을 병합했기 때문에 처음 속성을 준 칸을 제외한 밑으로 밀린 칸 4개를 삭제해야 합니다.

> 또는 세로 병합을 주기 전 미리 4칸을 삭제 후 세로병합을 주어도 됩니다.

TIP : 행열의 수가 많아질수록 칸삭제할 때 헷갈릴 수 있는데 미리 내용을 기입하고 칸병합을 하는게 편합니다.


8) 동시적용 ​: 체크박스에 체크를 한 속성 만큼 동시에 적용시킬 수 있습니다.

> 가로줄전체에 color값을 주고 싶다면 가로줄 전체를 클릭 후 칸 속성의 style에서 color 값을 주고 저장하면 됩니다.







●헤드칸(th) 지정하기

(헤드칸이란? 제목 · 타이틀 등으로 사용을 합니다)


- 테이블을 생성 후 헤드칸으로 지정할 칸의 T를 클릭 - 칸 설정 후 저장하기를 클릭합니다

(헤드칸(th)을 지정하지 않은 칸은 기본 칸(td) 입니다.)

 

 

- 저장해준 칸의 T를 클릭했을 때 헤드칸(th)의 글씨가 파란색이라면 헤드칸으로 지정이 된겁니다.

 




<3행 2열의 테이블>