오래전에 만들어 두었던 HTML table 태그를 활용해 만들었던 회사 결제용 일지 예제 샘플 코드입니다.
<html>
<head>
<title> new document </title>
<meta name="generator" content="notepad" />
<meta name="author" content="zzarungna" />
<meta name="description" content="html table sample code" />
</head>
<body>
<!-- 훈 련 일 지 결 제 라 인-->
<h1 align="center"><u>훈 련 일 지</u></h1>
<table border="0" width="700" align="center">
<tr>
<td><h5>훈 련 기관 명 : ZZARUNGNA</h5></td>
<!--valign 테이블에서 위아래 정렬-->
<td rowspan="2" width="300">
<table border="1" valign="top" width="100%" height="100">
<tr>
<td rowspan="3" width="35" align="center">결<br /><br />제</td>
<td width="80" height="15" align="center">강사</td>
<td width="110" height="15" align="center">관리자</td>
</tr>
<tr>
<td height="45" rowspan="2"> </td>
<td height="45" rowspan="2"> </td>
</tr>
</table>
<tr>
<td><h5>훈 련 과 정 명 : IT 개발 인력 양성과정</h5></td>
</tr>
<tr>
<td>
<h5><u>훈 련 일 : 2024년 7월 11일 목요일 ( 60 일 / 80 일)</u></h5>
</td>
</tr>
<!-- 첫번째 테이블 시작 구분 재적 출석 결석 지각 조퇴 -->
<table border="1" align="center" width="700">
<tr align="center" bgcolor="#CCFFCC">
<td height="20">구분</td>
<td height="20">재적</td>
<td height="20">출석</td>
<td height="20">결석</td>
<td height="20">지각</td>
<td height="20">조퇴</td>
</tr>
<tr>
<td align="center" width="150">적용자</td>
<td align="right">명</td>
<td align="right">명</td>
<td align="right">명</td>
<td align="right">명</td>
<td align="right">명</td>
</tr>
<tr>
<td align="center">미적용자</td>
<td align="right">명</td>
<td align="right">명</td>
<td align="right">명</td>
<td align="right">명</td>
<td align="right">명</td>
</tr>
<tr>
<td align="center">자활</td>
<td align="right">명</td>
<td align="right">명</td>
<td align="right">명</td>
<td align="right">명</td>
<td align="right">명</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
<table align="center" width="700" border="1" bgcolor="#CCFFCC">
<td colspan="6" align="center" bgcolor="#CCFFCC" height="40">
<strong>훈 련 사 항</strong>
</td>
</tr>
</table>
</td>
</tr>
<table align="center" width="700" border="1">
<tr bgcolor="#CCFFCC">
<td height="50" align="center">교시</td>
<td align="center">훈련과목</td>
<td align="center">담당교사</td>
<td align="center">훈련내용</td>
<td colspan="2" align="center">비고(불참자 등)</td>
</tr>
<tr align="center">
<td>1</td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
<tr align="center">
<td>2</td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
<tr align="center">
<td>3</td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
<tr align="center">
<td>4</td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
<tr align="center">
<td>5</td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
<tr align="center">
<td>6</td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
<tr>
<td align="center">지시<br />사항<br /></td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
<tr>
<td rowspan="4" align="center"><br /><br />특<br />기<br /><br />사<br />항<br /><br /></td>
<td align="center">지각자</td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
<tr>
<td align="center">결석자</td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
<tr>
<td align="center">조퇴자</td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
<tr>
<td align="center">기타사항<br />(전달사항,<br />외출자등)</td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
</tr>
</table>
</tr>
</table>
</body>
</html>
위코드를 복사하셔서 파일을 저장하실 땐 확장자만 원하시는 이름.html로 저장해 주시면 됩니다.
저장한 파일을 실행해 보시면 웹브라우저에서 확인할 수 있는 결과 화면입니다.
제가 작성한 html 코드를 복사해 몇 가지만 변경하시면 처음부터 만들지 않아도 되니 활용할 여지는 어느 정도 있을 것 같습니다.