HTML_CSS
(HTML) 테이블(table) 태그와 스타일을 사용하는 예
코딩ABC
2023. 4. 18. 09:25
반응형
C#에서 데이터베이스에서 가져온 자료로 보고서를 만들 때, 이 테이블의 모양의 코드를 사용하기 위해서 남긴 글입니다.
테이블(table) 태그와 스타일을 사용하는 예
<!DOCTYPE html>
<html>
<head>
<style>
table {
border-collapse:collapse;
width:500px;
text-align:center;
}
table, td, th { border:solid 1px #cccccc; }
tr { height:40px; }
#table_title { height:30px; background-color: #F6F6F6; }
#col1, #col4 { width:90px; }
#col2, #col3 { width:60px; }
#col5 { width:80px; }
.center { text-align:center; }
</style>
</head>
<body>
<h2>KTX 열차 시간표</h2>
<table>
<tr id="table_title">
<th>열차번호</th>
<th>출발</th>
<th>도착</th>
<th>출발시간</th>
<th>소요시간</th>
</tr>
<tr>
<td id="col1" class="center">123</td>
<td id="col2">서울</td>
<td id="col3">부산</td>
<td id="col4">21:00</td>
<td id="col5">02:44</td>
</tr>
<tr>
<td class="center">125</td>
<td>서울</td>
<td>부산</td>
<td>21:30</td>
<td>02:38</td>
</tr>
<tr>
<td class="center">211</td>
<td>서울</td>
<td>부산</td>
<td>22:00</td>
<td>02:42</td>
</tr>
</table>
</body>
</html>
반응형