Web/CSS
CSS(5) 표 꾸미기
공판다2
2020. 11. 4. 17:40
[ 코드 ]
<!DOCTYPE html>
<head>
<title>표 만들기</title>
<style>
table {
border-collapse : collapse;
}
thead {
background : darkgray;
color : white;
}
tr,th {
text-align : center;
padding : 10px;
height : 20px;
width : 100px;
border-bottom : 1px solid;
}
tbody tr:hover{
background : pink;
}
</style>
</head>
<body>
<h3>2020년 1학기 성적</h3><hr/>
<table>
<thead>
<tr>
<th>이름</th>
<th>HTML</th>
<th>CSS</th>
</tr>
</thead>
<tfoot>
<tr>
<th>합계</th>
<th>120</th>
<th>150</th>
</tr>
</tfoot>
<tbody>
<tr>
<th>고길동</th>
<th>70</th>
<th>80</th>
</tr>
<tr>
<th>둘리</th>
<th>50</th>
<th>70</th>
</tr>
</tbody>
</table>
</body>
</html>
[ 실행 화면 ]
