테이블 제목 위치 지정 caption-side 속성 HTML 태그로 표를 작성할 때 table 태그를 사용하며, table 태그 하위에 caption 태그로 표 제목을 지정할 수 있습니다. 이때 표 제목의 위치는 기본값으로 위에 표시됩니다만 표 제목을 아래에 위치시키고 싶을 경우 caption-side 속성을 사용하면 됩니다. caption-side 속성 기본형 caption-side : top | bottom 표 테두리 스타일 border 속성 표 테두리의 스타일 변경이 필요할 때는 border 속성을 사용하면 됩니다. border 속성은 표 이외에도 다양한 곳에 사용됩니다.  기본적으로 HTML의 table 태그로 그려진 표의 테두리는 외부 테두리와 내부 테두리로 표현이 됩니다. 외부 테두리는 table 태그에 스타일 지정해 주면 되고, 내부 테두리는 td, th 태그에 지정해 주면 됩니다. border 속성 기본형 border : <테두리 굵기> <테두리 모양> <테두리 색> border 테두리 속성값 리스트 속성값 설명 none 테두리 표시 안함.(단 주변에 의해서 그려질 수 있음.) hidden 테두리 표시 안함.(강한 우선순위로 표시되지 않음.) dotted 테두리가 점선으로 표현 dashed dotted 보다 길게 표현되는 점선 solid 테두리가 직선으로 표현 double 테두리가 두 선으로 표현 groove 테두리가 파인 듯한 모양으로 표현 ride 테두리가 튀어나온 듯한 모양. inset 테두리가 파인 듯한 모양으로 표현. boder-collapse의 값에 따라 차이가 있음. outset 테두리가 튀어나온 듯한 표현. boder-collapse의 값에 따라 차이가 있음. border 속성 사용 예제     < style >         table     {         border : 2px solid gray ;         caption-side : bottom ;         }

HTML 테이블, 표 구성 요소 관련 태그 table 태그, caption 태그 HTML 문서에 테이블을 추가할 때, 표의 구성 요소들을 <table></table> 안에 정의해줘야 합니다. 그리고 caption 태그를 사용해서 표의 제목을 달 수 있습니다. 표의 구조를 정의 thead, tbody, tfoot 태그 일반적인 표의 구조를 보게 되면 첫 행의 열에는 표의 열의 머리글이 위치하고 다음행부터는 본문의 내용들이 나오며, 표의 마지막 행에는 입력된 데이터의 전체 본문 영역 데이터의 합이나 TOTAL SUM값 등 표의 요약된 데이터가 위치하게 됩니다. 위에 설명된 것 과 같이 표의 구조상 표의 헤더 부분은 thead 태그로 선언하고, 표의 본문 영역은 tbody 태그로 표의 하단 요약부분은 tfoot 태그로 정의할 수 있습니다. 표의 구조를 태그로 구분 지었을때 얻을 수 있는 효과는 table 태그의 웹표준을 준수할 수 있으며, 자바스크립트 언어를 이용하여 thead 태그와 tfoot 태그로 지정한 부분은 고정으로 하고 tbody 부분만 스크롤 되도록 구현할 수 있습니다. 또, 인쇄할 때 각장마다 tbody와 tfoot으로 지정한 부분을 고정하여 출력할 수도 있습니다.  HTML 테이블, 표 본문 작성 tr, th, td 태그 HTML의 표의 행과 열을 만들 때는 우선 tr 태그를 선언해서 행을 추가 시키고 tr 태그 안에 td 태그를 넣어 각 열마다의 데이터를 넣어서 선언합니다.  이때, 열의 헤더 부분(머리글)로 지정하고 싶은 셀에는 th 태그를 이용해서 선언하고 th 태그로 선언했을 때는 일반 셀보다 굵게 표시되는 특징이 있습니다. 셀 병합 속성 rowspan, colspan 속성 테이블에서 셀 병합이 필요한 경우에는 병합이 시작되는 td 태그 및 th 태그에 rowspan이나 colspan의 속성을 사용하면 병합을 할 수 있습니다. 행 병합이 필요한 경우에는 rowspan="병합할 행 숫자" 열 병합이 필요한