📌 Table

1. caption

<caption>は、表ヘッダーまたは説明<table>要素の最初のサブアイテムとして使用する必要があります.

2. colspan, rowspan

colspan:列と列、すなわち横連結セル

rowspan:行と行の連結、すなわち垂直連結セル

    <table>
        <caption> 이달의 책 판매량 </caption>
        <tr>
            <th>구분</th>
            <th colspan="2">이름</th>
            <!-- <th>판매량</th> -->
        </tr>
        <tr>
            <td>1</td>
            <td>함께자라기</td>
            <td rowspan="2">100</td>
        </tr>
        <tr>
            <td>1</td>
            <td>해리포터2</td>
            <!-- <td>100</td> -->
        </tr>
	</table>

3. colgroup, col

<colgroup>およびそのサブエレメントとして使用される<col>エレメントは、1列に共通のスタイルを提供することができる

<colgroup>の<col>要素は、各テーブルの「列」

を表します.

colタグ付けされたspan属性は、<col>要素にマージする列数

を示す.

    <table>
        <caption>안녕하세요 테이블입니다.</caption>
        <colgroup>
            <col class="first">
            <col class="second" span="2">
            <col class="third" span="2">
        </colgroup>
        <tr>
            <td></td>
            <th scope="col">홍길동</th>
            <th scope="col">이현섭</th>
            <th scope="col">강길동</th>
            <th scope="col">강호동</th>
        </tr>
        <tr>
            <th scope="row">Skill</th>
            <td>똑똑</td>
            <td>웹개발</td>
            <td>꼼꼼</td>
            <td>천하장사</td>
        </tr>
    </table>

        td, th {
            border: 1px solid black;
        }

        .first {
            background-color: red;
        }

        .second {
            background-color: dodgerblue;
        }

        .third {
            background-color: green;
        }

4. scope

<th>要素scopeプロパティを使用して<td>に接続できます.

row:行方向を行います.ストリーム左から右へ

col:列方向を行います.ストリームは上から下へ

複雑な表で範囲を指定して、特定の見出しに関連付けられたセルの情報を指定します.

🐣 My Tabel

        <table>
            <caption>
                2022 카타르 월드컵
                <p>본선 조추첨 결과</p>
            </caption>
            <colgroup>
                <col class="bgr">
                <col>
                <col>
                <col>
            </colgroup>
            <tr>
                <th>GROUP A</th>
                <th>GROUP B</th>
                <th>GROUP C</th>
                <th>GROUP D</th>
            </tr>
            <tr>
                <td>카타르</td>
                <td>잉글랜드</td>
                <td>아르헨티나</td>
                <td>프랑스</td>
            </tr>
            <tr>
                <td>에콰도르</td>
                <td>이란</td>
                <td>사우디아라비아</td>
                <td>대륙 PO-1</td>
            </tr>
            <tr>
                <td>세네갈</td>
                <td>미국</td>
                <td>멕시코</td>
                <td>덴마크</td>
            </tr>
            <tr>
                <td>네덜란드</td>
                <td>유럽 PO</td>
                <td>폴란드</td>
                <td>튀니지</td>
            </tr>
            <tr>
                <th>GROUP E</th>
                <th>GROUP F</th>
                <th>GROUP G</th>
                <th>GROUP H</th>
            </tr>
            <tr>
                <td>스페인</td>
                <td>벨기에</td>
                <td>브라질</td>
                <td>포르투갈</td>
            </tr>
            <tr>
                <td>대륙 PO-2</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>