테이블 row나 column을 합치는 응용문제
실행 화면
소스 코드
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 | <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style type="text/css"> th{ background-color: #ccccff; } </style> </head> <body> <h2>고교수영부 기록</h2> <table border="1" style="width: 50%"> <b>■수영 기록</b> <tr> <th>종목</th> <th>거리</th> <th>성별</th> <th>기록</th> </tr> <tr> <td align="center" rowspan="4">자유형</td> <td align="center" rowspan="2">100m</td> <td align="center">남자</td> <td align="right">50초60</td> <tr> <td align="center">女子</td> <td align="right">55초56</td> </tr> <tr> <td align="center" rowspan="2">200m</td> <td align="center">남자</td> <td align="right">1분49초23</td> </tr> <tr> <td align="center">여자</td> <td align="right">1분59초56</td> </tr> </tr> <!-- 위아래 다른방식 --> <tr> <td align="center" rowspan="4">배형</td> <td align="center" rowspan="2">100m</td> <td align="center">남자</td> <td align="right">55초16</td> </tr> <tr> <td align="center">여자</td> <td align="right">1분01초13</td> </tr> <tr> <td align="center" rowspan="2">200m</td> <td align="center">남자</td> <td align="right">1분59초74</td> </tr> <tr> <td align="center">여자</td> <td align="right">2분10초46</td> </tr> </table> </body> </html> | cs |
'IT Study > Web' 카테고리의 다른 글
[HTML] CSS 적용방법 3가지 (0) | 2018.08.06 |
---|---|
[HTML] List 종류 (0) | 2018.08.06 |
HTML 테이블 예제-02 (0) | 2018.07.25 |
HTML 테이블 예제-01 (0) | 2018.07.25 |
HTML 기본 실습-04 (0) | 2018.07.24 |