<table colspan="셀 갯수">
가로 셀 병합 , <table colspan="3"> // 셀 3칸까지 가로 병합시킴
<table rowspan="셀 갯수">
세로 셀 병합,<table rowspan="3"> // 셀 3칸까지 세로병합
상세 정보 | |||
항목 | 1 | 2 | 3 |
4 | 5 | 6 | |
7 | 8 | 9 |
<!-- 아래 차시 학습 시 활용하세요 :)
16. HTML table 태그로 복잡한 표 작성하는 방법 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>잔재미코딩 blog</title>
</head>
<body>
<center>
<table border ="3" width ="600" cellspacing="0">
<tr>
<td></td>
<td colspan ="3">상세 정보</td>
</tr>
<tr>
<td rowspan="3">항목</td>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
</tr>
</table>
</center>
</body>
</html>
반응형
'프론트엔드개발 > HTML,CSS,BS' 카테고리의 다른 글
[CSS]step.2 <style type> font-szie / font-family / text-align 태그 적용하기 (0) | 2024.06.17 |
---|---|
[CSS]step.1 <td style=text-align:크기><h1>~<h5> (0) | 2024.06.08 |
[HTML]step.5 절대 경로 vs 상대경로 (0) | 2024.06.07 |
[HTML]step.4 표 테이블 <table> , 테스트 페이지해보기 (0) | 2024.06.02 |
[HTML]step.3 인코딩, <br><center><img src><font size> (0) | 2024.06.01 |