table colspan, rowspan 이미지처럼 만들려면 어케야하죠..
본문
table은 진짜 너무 어려운것 같아요.
아래 이미지처럼 만들어보려햇는대.. 도무지.... 안되네요
<table class="table">
<thead>
<tr>
<th></th>
<th colspan="4"></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td colspan="8"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
답변 2
<table class="table " >
<thead>
<tr>
<th rowspan="2"></th>
<th colspan="4"></th>
<th rowspan="2"></th>
<th rowspan="2"></th>
<th rowspan="2"></th>
<th rowspan="2"></th>
</tr>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td colspan="8"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Table Preview - Corrected</title>
<style>
table {
border-collapse: collapse;
width: 100%;
}
td {
border: 1px solid black;
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<table>
<tr>
<td rowspan="2" style="width: 20%;">1</td>
<td colspan="4" style="width: 40%;">2</td>
<td rowspan="2" style="width: 10%;">3</td>
<td rowspan="2" style="width: 10%;">4</td>
<td rowspan="2" style="width: 10%;">5</td>
<td rowspan="2" style="width: 10%;">6</td>
</tr>
<tr>
<td style="width: 10%;">7</td>
<td style="width: 10%;">8</td>
<td style="width: 10%;">9</td>
<td style="width: 10%;">10</td>
</tr>
<tr>
<td style="width: 20%;">11</td>
<td colspan="8">12</td>
</tr>
<tr>
<td style="width: 20%;">13</td>
<td style="width: 10%;">14</td>
<td style="width: 10%;">15</td>
<td style="width: 10%;">16</td>
<td style="width: 10%;">17</td>
<td style="width: 10%;">18</td>
<td style="width: 10%;">19</td>
<td style="width: 10%;">20</td>
<td style="width: 10%;">21</td>
</tr>
</table>
</body>
</html>
답변을 작성하시기 전에 로그인 해주세요.
