표 만들기
웹페이지 제작할 때 테이블만 잘 다루어도 좋은 웹페이지를 만들 수 있다.
따라서 반드시 숙지해야만 한다.
(1) <table></table>
테이블의 영역을 선언하는 태그로서 테이블의 처음과 끝을 지정한다.
따라서 테이블의 모양을 만드는 태그들은 이 블록의 내부에 포함되어야 한다.
<TABLE> 태그의 속성
border 표의 테두리 결정. 숫자를 지정하여 해당 숫자 굵기의 테두리가 그려진다.
cellspacing 셀과 셀 사이의 간격을 바꿀 때 사용한다.
cellpadding 셀 내부에서의 간격을 바꿀 때 사용한다.
width 셀의 가로 넓이를 지정한다.
height 셀의 높이를 지정한다.
align 표의 정렬방식을 지정한다.
(2) <tr></tr>
테이블의 열을 만든다. 이 태그가 없으면 모든 셀이 한 줄로 나타난다.
(3) <td></td>
테이블의 열을 만든다.
<td> 태그의 속성
align 해당 셀 내용의 정렬 방식으로 기본값은 center이다. (left, right, center)
valign 해당 셀 내용의 수직 정렬 방식으로 기본값은 top이다.
(top, middle, bottom, baseline)
rowspan 셀이 몇 개의 행에 걸쳐 있는지를 결정한다. 기본값은 1로 테이블의
형태에 따라 숫자를 정한다.
colspan 셀이 몇 개의 열에 걸쳐 있는지를 결정한다. 기본값은 1로 테이블의
형태에 따라 숫자를 정한다.
width 셀의 가로 넓이를 지정한다.
height 셀의 세로 높이를 지정한다.
nowrap 셀의 끝에서 다음 줄로 자동으로 내려가는 것을 금지한다.
▶ 예
<html>
<head>
<title>표 작성의 연습</title>
</head>
<body>
<table border color=”#78B0D0”>
<tr>
<td width=”486” colspan=”5”><p> </td>
</tr>
<tr>
<td width=”71” rowspan=”4”><p>< </td>
<td width=”101” rowspan=”2”><p>< </td>
<td width=”199” rowspan=”2”><p>< </td>
<td width=”97” rowspan=”2”><p>< </td>
</tr>
<tr>
<td width=”99” >< </td>
<td width=”94” >< </td>
</tr>
<tr>
<td width=”101” >< </td>
<td width=”99” rowspan=”2”>< </td>
<td width=”94” rowspan=”2”>< </td>
<td width=”97”< </td>
</tr>
<tr>
<td width=”101”>< </td>
<td width=”97”>< </td>
</tr>
</table>
</body>
</html>
'홈페이지 만들기' 카테고리의 다른 글
| Material Design 무료로 사용하기 (0) | 2021.04.27 |
|---|---|
| css 스타일 시트 a 명령어 [링크 밑줄과 색지우기] (0) | 2021.04.27 |
| 구글 폰트 사용하기 (0) | 2021.04.27 |
| 홈페이지 이미지 삽입하기 명령어 (0) | 2021.04.24 |
| 홈페이지 html 문서 작성 명령어 1 (0) | 2021.04.24 |
