html table 1

HTML 표 - 많은 행을 포함하는 셀

한 행 이상의 셀 범위를 만들려면 rowspan 특성을 사용하십시오.

예

<table style = "width : 100 %">

  <tr>

    <th> 이름 : </ th>

    <td> 빌 게이츠 </ td>

  </ tr>

  <tr>

    <th rowspan = "2"> 전화 번호 : </ th>

    <td> 55577854 </ td>

  </ tr>

  <tr>

    <td> 55577855 </ td>

  </ tr>

</ table>

HTML 표 - Caption 추가하기

캡션을 표에 추가하려면 <caption> 태그를 사용하십시오.

예

<table style = "width : 100 %">

  <caption> 월간 저축 </ caption>

  <tr>

    <th> 월 </ th>

    <th> 저축 </ th>

  </ tr>

  <tr>

    <td> 1 월 </ td>

    <td> $ 100 </ td>

  </ tr>

  <tr>

    <td> 2 월 </ td>

    <td> $ 50 </ td>

  </ tr>

</ table>

참고 : <caption> 태그는 <table> 태그 바로 뒤에 삽입해야합니다.

하나의 테이블을위한 특별한 스타일

특수한 테이블에 특별한 스타일을 정의하려면, id 속성을 테이블에 추가하십시오 :

예

<table id = "t01">

  <tr>

    <th> 이름 </ th>

    <성> 성 </ th>

    <th> 연령 </ th>

  </ tr>

  <tr>

    <td> Eve </ td>

    <td> 잭슨 </ td>

    <dd> 94 </ td>

  </ tr>

</ table>

이제이 표에 대한 특수한 스타일을 정의 할 수 있습니다.

table#t01 {

    width: 100%; 

    background-color: #f1f1c1;

}

그리고 더 많은 스타일을 추가하십시오.

table#t01 tr:nth-child(even) {

    background-color: #eee;

}

table#t01 tr:nth-child(odd) {

    background-color: #fff;

}

table#t01 th {

    color: white;

    background-color: black;

}