반응형
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>표 예제</title>
</head>
<body>
<table border="1" cellspacing="0">
<caption>공연정보</caption>
<tr>
<th>구분</th>
<th>골드</th>
<th>프리미엄</th>
<th>VIP</th>
</tr>
<tr>
<th>일반요금</th>
<td>20,900원</td>
<td>31,100원</td>
<td>34,200원</td>
</tr>
<tr>
<th>아동요금</th>
<td colspan="3">초등학생까지 일반 요금의 50%</td>
</tr>
<tr>
<th>공연시간</th>
<td>4시간20분</td>
<th>공연간격</th>
<td>20분</td>
</tr>
<tr>
<th>첫 공연시간</th>
<td>06시00분</td>
<th>마지막공연시간</th>
<td>익일02시</td>
</tr>
</table>
<hr>
<h3>예제문제1</h3>
<table border="1" cellspacing="0">
<caption>코스닥선물 투자자별 매매동향</caption>
<tr><!--F12를 눌러 비휘발성(새로고침하면 저장안됨)으로 스타일을 입력한 뒤에 복사 한 다음 들어간 곳에 아래 처럼 적용을 해줘면 편집기에서도 입력됨(저장하면 반영됨)-->
<th rowspan="2" style="background: #d24a2b;color: #fff;font-size: 15px;">구분</th>
<th colspan="3">매매수량</th>
<th colspan="3">매도수량</th>
<th rowspan="2">합계</th>
<th rowspan="2">순매수</th>
</tr>
<tr>
<th>신규</th>
<th>환매</th>
<th>소계</th>
<th>신규</th>
<th>환매</th>
<th>소계</th>
</tr>
<tr>
<th>선물회사</th>
<td>47</td>
<td>6</td>
<td>53</td>
<td>6</td>
<td>42</td>
<td>48</td>
<td>101</td>
<td>5</td>
</tr>
<tr>
<th>증권회사</th>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr>
<th>은행</th>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr>
<th>투자신탁</th>
<td>0</td>
<td>84</td>
<td>84</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>149</td>
<td>19</td>
</tr>
<tr>
<th>보험회사</th>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr>
<th>합계</th>
<td>47</td>
<td>90</td>
<td>137</td>
<td>6</td>
<td>42</td>
<td>48</td>
<td>250</td>
<td>24</td>
</tr>
</table>
<hr>
<h3>예제문제2_08/31</h3>
<figure>
<figcaption>점검장비 및 시험</figcaption>
</figure>
<table border="1" cellspacing="0">
<tr>
<th colspan="2" style="background-color: skyblue">구 분</th>
<th colspan="2" style="background-color: skyblue">점검장비</th>
</tr>
<tr>
<th colspan="2">휴대장비</th>
<td colspan="2">망원경, 확대경, 손전등, 카메라, 필기도구(흑판, 분필, 매직펜), 줄자, 균열경, 교통규제 기구 등</td>
</tr>
<tr>
<th colspan="2">접근장비</th>
<td colspan="2">사다리, 점검차(굴절차), 점검보트, 수중카메라 등</td>
</tr>
<tr>
<th rowspan="10">비파괴장비</th>
<th rowspan="4">콘크리트손상검사</th>
<td>콘크리트 강도 측정</td>
<td>슈미트해머, 테스트엔빌, 초음파탐사기, 탄성파탐사기</td>
</tr>
<tr>
<td>콘크리트 균열 및 결함탐사</td>
<td>초음파탐사기, 탄성파탐사기, 음파탐사기(AE법), 레이저탐사기, 적외선카메라, 스틸카메라, 레이다탐사기</td>
</tr>
<tr>
<td>철근탐사</td>
<td>페코미터, 방사선투과기</td>
</tr>
<tr>
<td>콘크리트 열화도탐사</td>
<td>재료시편에 대한 염해시험</td>
</tr>
<tr>
<th rowspan="6">강재손상탐사</th>
<td>표면균열 탐지</td>
<td>자기입자탐사기, 초음파탐사기, 염료침투법, 외동전류법</td>
</tr>
<tr>
<td>내부결함 탐지</td>
<td>초음파탐사기, AE장비, 방사선투과기</td>
</tr>
<tr>
<td>용접부 결함</td>
<td>초음파탐사기, 방사선투과기</td>
</tr>
<tr>
<td>피로균열탐사</td>
<td>자기입자탐사기, 염료침투법, 초음파탐사기</td>
</tr>
<tr>
<td>응력부식탐사</td>
<td>자기입자탐사기, 염료침투법</td>
</tr>
<tr>
<td>두께검사</td>
<td>초음파탐사기</td>
</tr>
</table>
</body>
</html>반응형
'IT > HTML&CSS' 카테고리의 다른 글
| [HTML] 내부스타일시트방식_기초(2021-08-31) (0) | 2021.11.08 |
|---|---|
| [HTML] 인라인스타일_기초(2021-08-31) (0) | 2021.11.08 |
| [HTML] 표만들기(Table)_기초(2021-08-27) (0) | 2021.11.08 |
| [HTML] 탭제목_기초(2021-08-17) (0) | 2021.11.07 |
| [HTML] 기본프레임 만들기(2021-08-17) (0) | 2021.11.07 |