전출처 : 인터라겐 > 테이블만들기.

★ 테이블내에 글자나 이미지를 삽입시켜 정렬하는 방법

<table cellspacing="셀사이간격" cellpadding="글자와 테두리의 간격" >

 

cellspacing="20"일때  .... 줄간격이 넓어졌다

<table bordercolor="skyblue" cellspacing="20" border="1">
<TBODY>
<TR>
<TD><IMG src="
http://roseate.hacca.jp/icon/ro_176b.gif"></TD>
<TD><IMG
src="
http://roseate.hacca.jp/icon/ro_176b.gif"></TD></TR></TBODY></TABLE><BR><BR>

table bordercolor="skyblue" - 여기서 테두리 색을 지정합니다.

cellspacing="20" - 이것은 테두리 끼리의 사이넓이를 말합니다..0으로 하면 한줄이죠..

border="1" -  이것은 테두리의 굵기를 지정하는것으로 숫자가 커질수록 굵어집니다.

<td> ~ </td> - 이것은 가로칸의 갯수를 나타냅니다...3개를 하고 싶은면 한번도 추가해 넣으면됩니다.

<tr> ~ </tr> - 이것은 세로칸을 나타냅니다.



cellspacing="0"일때  ...  줄간격이 없다.

<table bordercolor="skyblue" cellspacing="0" border="1"><TBODY>
<TR>
<TD><IMG src="
http://roseate.hacca.jp/icon/ro_176b.gif"></TD>
<TD><IMG
src="
http://roseate.hacca.jp/icon/ro_176b.gif"></TD></TR></TBODY></TABLE><BR><BR>

 



cellpadding="20"일때.... 테이블안의 여백이 넓어졌다

 

<table bordercolor="skyblue" cellpadding="20" border="1">
<TBODY>
<TR>
<TD><IMG src="
http://roseate.hacca.jp/icon/ro_176b.gif"></TD>
<TD><IMG
src="
http://roseate.hacca.jp/icon/ro_176b.gif"></TD></TR></TBODY></TABLE><BR><BR>



cellpadding="0"일때 ...  테이블안의 여백이 없다.

<TABLE borderColor=skyblue cellPadding=0 border=1><TBODY>
<TR>
<TD><IMG src="
http://roseate.hacca.jp/icon/ro_176b.gif"></TD>
<TD><IMG
src="
http://roseate.hacca.jp/icon/ro_176b.gif"></TD></TR></TBODY></TABLE>

 

 

추가로 배경에 색을 넣고 싶다면

<TABLE borderColor=skyblue cellSpacing=10  bgColor=lavenderblush border=3>
이렇게 백그라운드 색을 지정해 주면 cellSpacing=10  이라고 지정한 셀간격안에만 색이 지정됩니다...

반대로 cellpadding="20" 으로 지정해주고 나서 백그라운색을 지정해 주면 글자와 테두리 간격에 색이 입혀집니다.

 


댓글(0) 먼댓글(0) 좋아요(0)
좋아요
북마크하기찜하기