달력

4

« 2020/4 »

  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  •  
  •  


 

테이블(table)

·       HTML 문서에서 가장 많이 사용되는 태그입니다.

·       표 형식을 만드는 태그입니다.

·       <table>, <tr>, <td> 3가지는 가장 기본적인 태그입니다.

·       예전에는 웹사이트의 전체적인 레이아웃을 표 형식의 레이아웃으로 만드는데 사용하였으나 현재는 사용빈도가 많이 줄어들었습니다. (유지보수 비용와 테이블 태그의 한계)

 

 

<table> 태그

태그

설명

<table>

</table>

·       표의 시작과 끝을 나타내는 태그

<tr></tr>

·       table row의 약자

·       표의 한 을 만들어 주는 태그

·       단독으로 사용되기 때문에, table td에서 사용되는 속성들을 부여하실 수 없습니다

<td></td>

·       table data의 약자

·       표의 한 을 만들어 주는 태그( 행에 을 정의)

·       즉 행에서 ()을 나누는 기능

·       table에서 사용되는 속성들은 모두 td에서도 사용하실 수 있습니다

<th></th>

·       각 열의 제목을 나타냅니다.

·       모든 내용은 자동으로 굵은 글씨에 가운데 정렬이 됩니다.

 

 

 

 

테이블을 만드는 순서

단계

설명

1

테이블(table) 영역을 정의하고,

2

(tr)을 지정한 다음,

3

그 행을 나누어서 (td)을 만듭니다.

 

 

 

 

1, 1열의 테이블(1*1 테이블)

테이블의 경계선(border)을 지정해주어야 테이블의 모양을 볼 수 있습니다.

<table border="1">

        <tr>

                <td>1*1 </td>

        </tr>

</table>

 

 

 

1행에 2개의 칸()을 가진 테이블(1*2 테이블)

<table border="1">

        <tr>

                <td>1*1 </td>

                <td>1*2 </td>

        </tr>

</table>

 

 

 

(row)을 확장한 2 2열을 가진 테이블(2*2 테이블)

<table border="1">

        <tr>

                <td>1*1 </td>

                <td>1*2 </td>

        </tr>

        <tr>

                <td>2*1 </td>

                <td>2*2 </td>

        </tr>

</table>

 

 


Posted by codedragon codedragon

댓글을 달아 주세요