프론트앤드/HTML

[포스코x코딩온] 웹개발자 입문 과정 1주차 회고-06 | HTML table

영최 2023. 3. 3. 12:42
728x90

table에 대해서 알아보자

- 표를 만들 때 사용하는 태그이다.

- 과거에는 테이블을 사용하여 레이아웃을 구성하였으나, 기능 상의 한계로 인하여 

최근에는 공간 분할 태그인 <div>태그를 사용한다.

- 먼저 을 쓰고 자식 요소로 칸을 넣어주는 것이 기본적인 방식이다.

 

1. <table>: 표를 감싸는 태그

  - border : 테두리 두께

  - cellspacing : 테두리 간격 사이 너비

  - cellpadding : 셀 내부 간격

  - align : 테이블 정렬 속성

  - width&height : 테이블의 너비와 높이

  - bgcolor&bordercolor : 테이블 배경색과 테두리 색

 

2. <tr>: 표 내부의 행

 

3. <th>: 표 내부의 제목 칸

 

4. <td>: 행 내부의 일반 칸

  - colspan : 해당 칸이 점유하는 열의 수 지정
  - rowspan : 해당 칸이 점유하는 행의 수 지정

 

 

오늘은 두번째 날로 table을 작성하는 법에 대해서 배웠다.

table은 행을 먼저 tr태그로 써주고 열을 td로 하위로 넣어서 작성할 수 있다.

또한 th를 이용해서 표 내부의 제목칸을 사용할 수 있다.

 

728x90