테이블 태그-병합

imjingu·2023년 7월 4일
0

개발공부

목록 보기
37/481

표를 만든 후 표의 행이나 열을 합치는 쉘을 만드는 <td><th> 태그에서 사용

colspan="합쳐지는 열의 개수" : 가로의 병합
rowspan="합쳐지는 행의 개수" : 세로의 병합

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        td, th {
            border: 2px solid black;
            /* 테두리 스타일 */
        }
    </style>
</head>
<body>
    
    <!-- colspan -->
    <table>
        <caption>colspan</caption>
        <tr>
            <th colspan="2"> 코리아 교육 그룹</th>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
        </tr>
        <tr>
            <td>3</td>
            <td>4</td>
        </tr>
    </table>
    <!-- rowspan -->
    <table>
        <caption>rwospan</caption>
        <tr>
            <th rowspan="3"> 코리아 교육 그룹</th>
            <td>1</td>
            <td>2</td>
        </tr>
        <tr>
            <td>3</td>
            <td>4</td>
        </tr>
        <tr>
            <td>5</td>
            <td>6</td>
        </tr>
    </table>
</body>
</html>

0개의 댓글