Follow JookJun on Twitter
      만당 최신 글
      만당 최신 댓글
counter
오늘:
582
어제:
637
전체:
1,987,529

TABLE 실기 (첫번째)

조회 수 2160 추천 수 293 2005.01.18 23:02:19

TABLE 실기 (첫번째)

 

위의 본글이 너무 간단히 설명 되어 있어 이해 하려면 상당히 어려움이 있을겁니다

몇차례에 걸쳐 답글로 하나씩 풀어 나가겠습니다.

 

비결은, 읽기만 하시지 말고 "태그연습장" 에

부지런히 연습 하는 수 밖에 없습니다.........방랑객..

(아래의 예제를 이용 하여 연습 하세요...............................................)

 

1]

TABLE(테이블)

 

소스는

<TABLE border=1>
<TBODY>
<TR>
<TD>TABLE(테이블)</TD></TR></TBODY></TABLE>

 

TABLE--글 혹은 그림 을 정해진 공간 안에 쓰게 하는 명령.(Table=밥상을 차리다 라고 생각 하면..)

border--테두리의 굵기....값을 0 으로 하면 테두리가 보이지 않게 설정 됨

TBODY--본문 시작

TR--줄 (아래로 이동) 을 만들어 줌

TD--간 (옆으로 이동) 을 만들어 줌

 

**<TABLE><TBODY><TR><TD> 순서로 명령 했기에 반드시

**</TD></TR></TBODY></TABLE> 역순으로 닫아 주어야 함

 

2]

한가지씩 더하며 위의 TABLE 모양을 변형 시켜 나갑시다.

TABLE(테이블) 오른쪽 두번째 간

 

소스는 아래와 같습니다

<TABLE border=1>
<TBODY>
<TR>
<TD>TABLE(테이블)</TD>
<TD>오른쪽 두번째 간</TD></TR></TBODY></TABLE>

 

"(테이블)" 뒤에</TD>로 막고 다시<TD>로 옆으로 만들어질 간을 지정 하고 "오른쪽 두번째 간"을 넣었음

 

3]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더

 

소스

<TABLE border=1>
<TBODY>
<TR>
<TD>TABLE(테이블)</TD>
<TD>오른쪽 두번째 간</TD><TD>다시 한간더</TD></TR></TBODY></TABLE>

 

4]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더
줄 바꿔 아래로

 

소스

<TABLE border=1>
<TBODY>
<TR>
<TD>TABLE(테이블)</TD>
<TD>오른쪽 두번째 간</TD>
<TD>다시 한간 더</TD></TR><TR><TD>줄 바꿔 아래로</TD></TR></TBODY></TABLE>

 

"다시 한간 더" 뒤에</TD></TR>간과 줄을 막고 <TR><TD>로 아래 줄과 간을 지정 하고 "줄 바꿔 아래로" 를 넣음

 

5]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더
줄 바꿔 아래로 아래두번째 아래세번째

 

아랫줄 두번째간과 세번째간은 직접 만들어 보시길...

 

6]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더
줄 바꿔 아래로 아래두번째 아래세번째

 

<TABLE borderColor=#A82800 border=1> 테두리 색상을 지정 했음. (아래 게시물 "색상표" 참조)

 

7]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더
줄 바꿔 아래로 아래두번째 아래세번째

 

<TABLE borderColor=#A82800 bgColor=#f5f5f5 border=1> 바닥 색상을 지정 했음

 

8]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더
줄 바꿔 아래로 아래두번째 아래세번째

 

<TABLE borderColor=#a82800 cellPadding=5 bgColor=#f5f5f5 border=1> 간을 키웠음

 

9]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더
줄 바꿔 아래로 아래두번째 아래세번째

 

<TABLE borderColor=#a82800 cellSpacing=6 cellPadding=5 bgColor=#f5f5f5 border=1>

테두리와 내용의 간격 (선과 선의 간격) 을 넓혔음.

 

10]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더
줄 바꿔 아래로 아래두번째 아래세번째

 

<TABLE borderColor=#a82800 cellSpacing=6 cellPadding=5 bgColor=#f5f5f5 border=6>

테두리를 굵게 했음

 

11]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더
줄 바꿔 아래로 아래두번째 아래세번째

 

<TABLE borderColor=#a82800 cellSpacing=6 cellPadding=5 bgColor=#f5f5f5 border=0>

테두리를 감추었음....

 

12]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더
줄 바꿔 아래로 아래두번째 아래세번째

 

<TABLE borderColor=#a82800 cellSpacing=6 cellPadding=5 width=500 bgColor=#f5f5f5 border=0>

테이블의 넓이를 넓혔음.

 

13]

TABLE(테이블) 오른쪽 두번째 간 다시 한간 더
줄 바꿔 아래로 아래두번째 아래세번째

 

<TABLE borderColor=#a82800 height=120 cellSpacing=6 cellPadding=5 width=500 bgColor=#f5f5f5 border=0>

테이블의 높이도 높혔음

 

13]의 전체 소스는

<TABLE borderColor=#a82800 height=120 cellSpacing=6 cellPadding=5 width=500 bgColor=#f5f5f5 border=0>
<TBODY>
<TR>
<TD>TABLE(테이블)</TD>
<TD>오른쪽 두번째 간</TD>
<TD>다시 한간 더</TD></TR>
<TR>
<TD>줄 바꿔 아래로</TD>
<TD>아래두번째</TD>
<TD>아래세번째 </TD></TR></TBODY></TABLE>

 

각 명령어에 주어진 값을 바꾸어 보며 연습.......

 

다음은 <TD>에 부가되는 여러가지 명령어의 실기를 올릴 예정.

엮인글 :

김영조

2005.01.19 22:58:02
*.5.244.72

방랑객님, 이 부분만 연습 한번씩 해 볼려고 해도 시간이 무지 걸린답니다...좀 천천히 가시면 좋겠습니다.
그리고 너무 길어서 아래 위로 왔다 갔다가 좀 힘이 드는데, 프린트 아웃 안하고도 쉽게 연습할 수 있을려면
한가지 내지 두가지만 한 연습장에 있으면 좋겠습니다.....감사 드리고 부탁도 드립니다...

김영조

2005.01.19 23:35:31
*.5.244.72






HOW ARE YOU? WHAT ARE YOU?
I'M 오랑캐..
BUT I LIKE IT..

채점 해 주시길 바랍니다. 그 이후에 지우겠습니다..

방랑객

2005.01.20 08:55:07
*.235.29.148

두고두고 연습 하시고요.
연습을 덧글로 하시면, 연습 한 글의 소스를 뒤집어 볼수가 없어
잘못된 점을 지적 할수가 없습니다.
그래서 태그 연습장을 만들어 두었으니 태그 연습장의 본글로 연습 하시면ㄴ
소스를 뒤집어 보고 잘 못된 부분을 지적 해 드리겠습니다....................

처음엔 연습글을 자신이 지워 주셨으면 했으나....
지우지 말고 그대로 두시는게 좋을것 같습니다 얼마 동안은 요....
그래야 잘못된것 또 그 잘못된것의 소스를 대조 해 보는것도 연습이 될터이니까요...

방랑객

2005.01.20 09:22:16
*.235.29.148

깅영조님의 글쓴 소스는 아래와 같습니다.
*TABLE*
*TBODY*
*TR*
*TD* HOW ARE YOU? */TD*
*TD* WHAT ARE YOU? */TD*----- 여기 */TR* 이 한번 빠졌습니다.(줄바꿈 )
*TR* *TD* I'M 오랑캐.. */TD* */TR* *TD* BUT I LIKE IT.. */TD* */TR* */TBODY* */TABLE*
오랑캐.. */TD* */TR* *TD* BUT I LIKE IT.. 에서----*/TR* 은 빼세요....

* 기호는 쐐기로 읽어 주세요....

방랑객

2005.01.20 09:23:42
*.235.29.148

태그연습장 본글로 다시 올려 보세요.

zerozo

2005.01.20 11:45:10
*.5.244.72

태그연습장은 어느 것을 말씀하십니까? 윗글을 말씀하시는 것 같은데, 들어 갈 수가 없습니다...수정난도 안 보이고.....
그래서 또 덧글로 연습해 봅니다...




iT WAS GOOD.IT WAS VERY GOOD. IT WAS THE BEST.
SUNSHINECRISTAL CLEARSNOW?


#13 을 실습한 것입니다....시간이 다 되어서 ...

zerozo

2005.01.20 11:47:58
*.5.244.72

죄송합니다.. #13이 아니고 #5입니다... NO 감점...

방랑객

2005.01.20 12:21:08
*.235.29.148

도움말-- "도움말코너"라는 문패 오른쪽에
"죽전만당" "HTML&태그""태그 연습장""컴퓨터상식" 라는 네게의 단추가 있습니다.
List of Articles
번호 제목 글쓴이 날짜 조회 수sort
143 댓글이 모조리 지웠졌습니다. 35/철부지 2010-02-26 1471
142 16회 새 카페를 죽전만당에서 "기수별 바로가기"변경을 ..... [4] 전윤수 2010-02-17 1540
141 블로그 꾸미기. 采日 2005-05-04 2034
140 align & vAlign practice 김영조 2005-01-25 2037
139 응용 2 : 링크 하기 (한 페이지만 링크) [3] 방랑객 2005-01-17 2084
138 [re] Table 만들기 -수정- [3] 방랑객 2005-01-22 2094
137 [re] 1/23 설교 수정 [2] 방랑객 2005-01-24 2105
136 5, 명령어 사전 방랑객 2005-01-16 2112
135 연속듣기 시험 시험 2005-03-04 2116
134 응용 2 : 링크 하기 (한 페이지만 링크) [3] 방랑객 2005-01-17 2120
133 5, 명령어 사전 방랑객 2005-01-16 2135
132 [re] align & vAlign practice-수정- [4] 방랑객 2005-01-26 2147
131 [re] 1/23 설교 수정 [2] 방랑객 2005-01-24 2150
130 만화 연습 [4] zero 2005-01-29 2151
129 TABLE 실기 (두번째) - align 과 valign - 방랑객 2005-01-19 2153
128 6. TABLE(테이블) 만들기 방랑객 2005-01-18 2156
127 블로그와, 블로그에 관한 실태를 알아 본다. [1] 방랑객 2005-02-15 2156
» TABLE 실기 (첫번째) [8] 방랑객 2005-01-18 2160
125 로그인 하지 말고 연습 하세요. [1] 방랑객 2005-01-17 2162
124 TABLE 실기 (첫번째) [8] 방랑객 2005-01-18 2162