웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
[HTML 초보자] 테이블 태그(보충1)
2002.12.21 11:40
제가 작성한 강좌를 쭉 읽으면서 테이블태그에 약해서 보충하여 올립니다.
오늘 배울태그는 테이블의 CellPadding과 CellsPacing를 배워보도록 하겠습니다.
Cellspacing: 셀의 여백을 조정할 수 있습니다.
Cellpadding: 셀을 가늘게 만들수 있습니다.
<table border="1" cellspacing="0">
<tr>
<td>표의 셀여백 조정은 0값이고, 숫자를 크게하면 커지겠죠.</td>
</tr>
</table>
아마 이렇게 하면 표의 여백은 0값으로 줄어들고 숫자를 크게하면 여백이 커집니다.
<table border="1" cellspacing="10">
<tr>
<td>표의 셀여백 조정은 0값이고, 숫자를 크게하면 커지겠죠.</td>
</tr>
</table> 을 해보십시오.
그리고 또한 셀을 가늘게 만들려면,
<table border="1" cellpadding="0">
<tr>
<td>표의 셀을 가늘게 한값은 0값이고, 숫자를 크게하면 커지겠죠.</td>
</tr>
</table> 을 하면 테이블의 테두리가 가늘게 만들어집니다.
<table border="1" cellpadding="10">
<tr>
<td>표의 셀을 가늘게 한값은 0값이고, 숫자를 크게하면 커지겠죠.</td>
</tr>
</table> 또 이렇게 만들어도 테이블의 테두리가 두껍어집니다.
혼합으로
<table border="1" cellpadding="0" cellspacing="0">
<tr>
<td>아주 가늘게</td>
</tr>
</table> 를 사용하면 아주가늘어지죠..^^
border="1"을하면 테두리 값이 안보이지만, 일반 <table><tr><td>내용</td></tr></table>한것보다 가늘게 보이죠.
cellpadding="수치값"과 cellspacing="수치값"의 숫자를 많이 넣어서 사용해보기 바랍니다. 차이점이 나타나거든요.
※ 그리고 제가 <table><tr><td>내용</td></tr></table>만 사용하여 표의 셀을 한개만 추가했는데, 여러개를 추가하는방법을 [HTML 초보자] 테이블 태그(보충2) 강좌에서 하겠습니다.
오늘의 명심 cellpadding과 cellspacing의 차이점을 알아보자!
오늘 배울태그는 테이블의 CellPadding과 CellsPacing를 배워보도록 하겠습니다.
Cellspacing: 셀의 여백을 조정할 수 있습니다.
Cellpadding: 셀을 가늘게 만들수 있습니다.
<table border="1" cellspacing="0">
<tr>
<td>표의 셀여백 조정은 0값이고, 숫자를 크게하면 커지겠죠.</td>
</tr>
</table>
아마 이렇게 하면 표의 여백은 0값으로 줄어들고 숫자를 크게하면 여백이 커집니다.
<table border="1" cellspacing="10">
<tr>
<td>표의 셀여백 조정은 0값이고, 숫자를 크게하면 커지겠죠.</td>
</tr>
</table> 을 해보십시오.
그리고 또한 셀을 가늘게 만들려면,
<table border="1" cellpadding="0">
<tr>
<td>표의 셀을 가늘게 한값은 0값이고, 숫자를 크게하면 커지겠죠.</td>
</tr>
</table> 을 하면 테이블의 테두리가 가늘게 만들어집니다.
<table border="1" cellpadding="10">
<tr>
<td>표의 셀을 가늘게 한값은 0값이고, 숫자를 크게하면 커지겠죠.</td>
</tr>
</table> 또 이렇게 만들어도 테이블의 테두리가 두껍어집니다.
혼합으로
<table border="1" cellpadding="0" cellspacing="0">
<tr>
<td>아주 가늘게</td>
</tr>
</table> 를 사용하면 아주가늘어지죠..^^
border="1"을하면 테두리 값이 안보이지만, 일반 <table><tr><td>내용</td></tr></table>한것보다 가늘게 보이죠.
cellpadding="수치값"과 cellspacing="수치값"의 숫자를 많이 넣어서 사용해보기 바랍니다. 차이점이 나타나거든요.
※ 그리고 제가 <table><tr><td>내용</td></tr></table>만 사용하여 표의 셀을 한개만 추가했는데, 여러개를 추가하는방법을 [HTML 초보자] 테이블 태그(보충2) 강좌에서 하겠습니다.
오늘의 명심 cellpadding과 cellspacing의 차이점을 알아보자!
댓글 3
-
Medic
2002.12.21 12:46
서명이 인상적입니다. -
ZipShin
2002.12.21 21:40
서명..ㅋㅋ 이 얼굴 ZipShin의 4살때 모습입니다. 하하하 -
zerock
2002.12.26 13:46
cellpadding 는 셀 내부의 간격을 말하며.. cellspacing 는 셀 외부를 말하는 겁니다.
다시 말하자면.. cellpadding 는 셀 안쪽의 여백을 크게 또는 작게 할수 있으며
cellspacing 는 셀과 셀사이의 여백을 크게 또는 작게 할수 있습니다.
즉 두개다 셀의 간격을 줄였다 늘였다 할수 있는 기능입니다.
위의 내용과 같이 cellpadding 은 셀의 여백을 줄이는게 아니라 셀 안쪽여백을 늘였다 줄였다 할수 있습니다.
다음의 예제를 실행해 보시면 답이 나올겁니다.
<table cellpadding=2 cellspacing=2 bgcolor=black>
<tr bgcolor=white><td>첫번째셀</td><td>두번째셀</td></tr>
</table>
참고로 cellpadding 과 cellspacing 을 지정해 주지 않았다면 cellpadding 는 1로 잡히며, cellspacing 는 2로 잡힙니다.
제목 | 글쓴이 | 날짜 |
---|---|---|
[HTML 초보자]동영상을 출력하자-7(Object) [2] | ZipShin | 2003.01.03 |
테이블 테두리 (맨 겉부분만 나오게 하기) [13] | 서성원 | 2003.01.02 |
HTML만으로 BGM Player 만들기... [7] | 고광욱 | 2003.01.02 |
이쁜 버튼 꾸미기 [5] | ZipShin | 2003.01.01 |
새창안돼 -_- [5] | 란즈 | 2002.12.27 |
한번의 클릭으로 두 개의 프레임 바꾸기. [7] | 연(延) | 2002.12.25 |
[re] 한번의 클릭으로 두 개의 프레임 바꾸기. [1] | 루비 | 2002.12.26 |
마우스 룰 오버시 여러가지 로 그림이 변하게 하기. [5] | ▩윤미 | 2002.12.23 |
웹문서 작성 팁!!! [4] | 공돌이 | 2002.12.21 |
[HTML 초보자] 테이블 태그(보충1) [3] | ZipShin | 2002.12.21 |
필드셋 응용;;; | teslaMINT | 2002.12.21 |
[HTML 초보자]동영상을 출력하자-6(Object) [1] | ZipShin | 2002.12.19 |
[HTML 초보자]동영상을 출력하자-5 | ZipShin | 2002.12.18 |
[HTML 기초] 1. 서식 관련 태그 | 뽀유♡ | 2002.12.17 |
[HTML 초보자]동영상을 출력하자-4 | ZipShin | 2002.12.17 |
[HTML 초보자]동영상을 출력하자-3(높이와 넓이) | ZipShin | 2002.12.16 |
[HTML 초보자]동영상을 출력하자-2 [3] | ZipShin | 2002.12.12 |
[HTML 초보자]동영상을 출력하자-1 [6] | ZipShin | 2002.12.11 |
[프레임셋] 1024*768.. 800*600 에서도 화면 제대로 보이기... [5] | hooniv | 2002.12.10 |
[HTML 초보자]iframe대신 사용할수있는 오브젝트-2 [12] | ZipShin | 2002.12.06 |