테이블 병합에 관한 태그 정리
<src 1.0 ori>
<!DOCTYPE html>
<html>
<head>
<charset="EUC-KR">
<title>colspan 속성 사용법</title>
</head>
<body>
<table border="1" width="250" height="100">
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>

1. colspan 속성 - 열 합치기
<td colspan="합칠 셀의 개수"> 내용 </td>
<th colspan="합칠 셀의 개수"> 내용 </th>
- colspan 속성의 col은 영어로 '열'을 뜻하는 column의 앞글자 col 사용
<src 1.1 colspan>
<!DOCTYPE html>
<html>
<head>
<charset="EUC-KR">
<title>colspan 속성 사용법</title>
</head>
<body>
<table border="1" width="250" height="100">
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td colspan="3"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>

2. rowspan 속성 - 행 합치기
<td rowspan="합칠 셀의 개수"> 내용< /td>
<th rowspan="합칠 셀의 개수"> 내용< /th>
- rowspan 속성의 row는 영어로 '행'을 뜻하는 row 사용
<src 1.2 rowspan>
<!DOCTYPE html>
<html>
<head>
<charset="EUC-KR">
<title>colspan 속성 사용법</title>
</head>
<body>
<table border="1" width="250" height="100">
<tr>
<td rowspan="3"></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>

'program > WEB' 카테고리의 다른 글
| [JQ]Getting background image url. (0) | 2021.01.29 |
|---|---|
| [JS]방향키 스크롤 막기 (0) | 2021.01.26 |
| [CSS] input number 증가 감소 버튼 숨기기 (0) | 2021.01.25 |
| [HTML] 특수태그 (0) | 2021.01.24 |
| [CSS] 단어단위로 줄바꿈을 하고싶어 ...word-break (0) | 2021.01.16 |