[HTML기초] 표만들기
오늘은 html기초
<table> <tr> <td> <th> colspan rowspan에 대하여 각각 알아보도록 하겠습니다.
HTML 웹 문서에서 표(table)를 만드는 방법은
table 요소는 엑셀과 같이 데이터를 표 형태로 나타내기 위해 사용되며.
이전에는 table 요소를 이용하여 레이아웃을 만들 때 사용하기도 했지만 좋은 방법이 아니다.
그러면 표를 만들기 위해 사용되는 태그들에 대해서 알아보도록 하겠다.
<table> <tr> <td> <th>
기본적인 테이블을 만들기 위해서는 <table>, <tr>, <td>, <th> 태그를 이용한다.
<table>은 표 형태를 만들며 <tr>은 행(row), <td>는 열(column), <th>는 표 제목을 정의하기 위해 사용된다
colspan, rowspan - 행 및 열의 개수를 합침
행(row)이나 열(column)을 합치기 위해서는
<td> 또는 <th> 태그에 rowspan 또는 colspan 속성을 사용하며 합칠 셀의 수를 지정한다.
<!DOCTYPE>
<html>
<head>
</head>
<body>
<table width="500"border="1">
<tr>
<th colspan="2">구 분</th>
</tr>
<tr>
<th>태그</th>
<th>설명</th>
</tr>
<tr>
<td>table</td>
<td>표의 정의</td>
</tr>
<tr>
<td>tr</td>
<td>행의 정의</td>
</tr>
<tr>
<td rowspan="2">td</td>
<td>열의 정의</td>
</tr>
<tr>
<td>속성 : rowspan, colspan</td>
</tr>
<tr>
<td rowspan="2">th</td>
<td>표의 제목을 정의</td>
</tr>
<tr>
<td>속성 : rowspan, colspan</td>
</tr>
</table>
</body>
위 코드의 결과값은 아래와 같습니다.
'홈페이지제작 > HTML' 카테고리의 다른 글
| html display:inline 속성에 대하여 (0) | 2018.03.23 |
|---|---|
| [html] 태그 div 이해하기, style 이해활용 (0) | 2018.03.23 |
| iframe 태그 사용법과 유튜브 동영상 삽입하기 (0) | 2018.03.07 |
| HTML5 기본 이해하기 (0) | 2018.03.02 |
| [HTML] 홈페이지에 오디오 삽입 방법 (0) | 2018.02.06 |
itworldkorea
IT korea가 세상(world)을 변화시킨다.