| <🎜> | <🎜> |
| <🎜> | <🎜> | <🎜> |
< /tbody>테이블의 구조
<table>
;</td>
;
~ td>
<td></td>
< ;/table>
<테이블>속성 너비: 테이블 너비, 단위는 백분율 또는 고정 값일 수 있습니다. 높이: 테이블 높이.
정렬: 표의 가로 정렬, 값: 왼쪽, 가운데, 오른쪽
테두리: 테두리 두께.
< tr> 속성 - 행 태그
bgColor: 행의 배경색
height: 행 높이
정렬: 행의 텍스트가 가로 가운데에 정렬되고 값: 왼쪽, 가운데, 오른쪽valign: 수직 중앙, 값: 상단(상단), 중간(중간), 하단(하단)
<td> 또는 <번째> 속성
< ;는 일반 셀이고, <th>는 제목 셀이며 중앙에 굵은 글씨로 표시됩니다.
너비: 셀 너비
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<table border="2" width="300" height="100" bordercolor="blue" bgColor="#88cc66" cellspacing="0" cellpadding="2" rules="all">
<tr>
<td>工号</td>
<td>姓名</td>
<td>职位</td>
</tr>
<tr>
<td>001</td>
<td>小明</td>
<td>设计师</td>
</tr>
<tr>
<td>002</td>
<td>小方</td>
<td>工程师</td>
</tr>
<tr>
<td>003</td>
<td>小白</td>
<td>程序员</td>
</tr>
</table>
</body>
</html>
참고: 속성은 대소문자를 구분합니다. bgColor가 bgcolor로 기록되면 아무런 효과가 없습니다.
각 속성을 입력하고 출력 효과를 볼 수 있습니다
캡션 태그
표에 제목 및 요약 추가
요약 요약 내용은 브라우저에 표시되지 않습니다. 그 기능은 테이블의 가독성(의미화)을 높이고, 검색 엔진이 테이블 내용을 더 잘 이해할 수 있도록 하며, 또한 화면 판독기를 사용하여 특수 사용자가 테이블 내용을 더 잘 읽을 수 있도록 하는 것입니다.
구문: <table summary="table Introduction text">
Title은 테이블의 내용, 제목의 표시 위치: 테이블 위.
구문:
<table> <caption>제목 텍스트</caption>
<tr> <td>…</td>
안돼
다음 섹션
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<table border="2" width="300" height="100" bordercolor="blue" bgColor="#88cc66" cellspacing="0" cellpadding="2" rules="all">
<tr>
<td>工号</td>
<td>姓名</td>
<td>职位</td>
</tr>
<tr>
<td>001</td>
<td>小明</td>
<td>设计师</td>
</tr>
<tr>
<td>002</td>
<td>小方</td>
<td>工程师</td>
</tr>
<tr>
<td>003</td>
<td>小白</td>
<td>程序员</td>
</tr>
</table>
</body>
</html>
