|
Table 짜기
테이블의 기본구조

기본 테이블
<table>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
</table>
Align 과 valign
<table width=200 height=100 border=2>
<tr>
<td align=left>1</td>
<td align=center>2</td>
<td align=right>3</td>
</tr>
<tr>
<td valign=top>4</td>
<td valign=middle>5</td>
<td valign=bottom>6</td>
</tr>
</table>
cellpadding
<table cellpadding=10
cellspacing=0 border=2>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
cellspacing
<table cellpadding=0 cellspacing=15
border=2>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
border
<table cellpadding=0 cellspacing=0 border=5>
<tr>
<td width=30%>1</td>
<td width=30%>2</td>
<td width=30%>3</td>
</tr>
<tr>
<td width=30%>4</td>
<td width=30%>5</td>
<td width=30%>6</td>
</tr>
</table>
셀 합치기
<table border=1 width=50%>
<tr>
<td colspan=2>1</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td rowspan=2>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
</tr>
</table>
cell 마다 bgcolor를 줄 수 있습니다.
border=0으로 하면 테이블 모양이 보이지 않고
내용만 보입니다.
Frame 페이지
아래위로 나뉘는 프레임
<frameset rows="50%,50%">
<frame src=top.htm>
<frame src=bottom.htm>
</frameset>
옆으로 나누고 다시 아래위로 나뉜 프레임
<frameset cols="30%,*"
frameborder=no border=0>
<frame src=left.htm name=left scrolling=yes>
<frameset rows="20%,*">
<frame src=top.htm name=top>
<frame src=bottom.htm name=bottom
scrolling=auto>
</frameset>
</frameset>
Target을 지정하여 링크시키기
<a href=newpage.htm target=bottom>여기를
눌러주세요</a>
실습예제 : Text Sample / Image Sample - 이미지
1, 이미지 2
|