오궁 가족들이 쓴 글들을 모아둔 곳입니다.

 로그인

태그 강좌(8) - 테이블 태그
BOF   2005-01-17 18:47:03, 조회 : 1,821, 추천 : 133

제목 없음

오늘은 테이블 태그에 대해 알아보도록 하겠습니다.

테이블 태그는 무지 간단하면서도 어렵습니다. 그리고 무척 많이 사용됩니다.
무슨 얘기냐구요?

예, 왜냐하면 테이블 테그에 사용되는 테그는 몇개 안됩니다. 그러나 실제로 사용될 때는 그것들이 어떤 결과를 가져올 지 쉽게 짐작이 안되기 때문에, 즉 시각적으로 상상하기기 쉽지 않기 때문에 실제로 실행해 보기 전에는 알기가 쉽지 않고 또 예상치 않은 결과가 나올 수 있습니다.

그런데 꼭 표를 그려넣는 작업이 아니라도 테이블의 형식을 사용하게 되면 많은 종류의 그림과 내용들을 일목요연하게 보기 쉽게 배치할 수가 있습니다.

예를 들어서 특정한 그림을 화면의 특정 부위에 배치하고 싶을 때 표를 쓰지 않으면 상당히 힘이 듭니다. 그러나 표를 써서 그림을 표 속에 넣어 버리면 아주 간단히 해결됩니다. 그래서 웹페이지에서 표는 아주 중요하고 요긴하게 쓰입니다.

소스 보기를 해 보면 대부분의 웹 페이지에 많은 표들이 들어가 있을 겁니다. 그러나 실제로 표처럼 보이는 문서는 잘 없죠? 그것은 표의 형식을 가지고 있으면서 표의 테두리 선을 없애 버려서 꼭 표가 아닌 것같이 보이도록 해 놓았기 때문입니다.

예를 들어 보겠습니다. 아래와 같이 표를 만들고 그 중 적당한 곳에 그림을 넣습니다. 그리고 다른 곳에 필요한 내용을 적당히 집어 넣어보겠습니다.

저희 가족 홈페이지 사진을 이용해서 한 번 설명해 볼까요?
아래의 그림은 저희 가족이 모두 모여 찍은 사진입니다.

이 사진을 글의 중간에 위치시키고 설명을 이렇게 집어 넣으려고 하면 딴 방법으로는 쉽지가 않습니다 그러나 표를 사용해서 화면을 여러개의 칸으로나눈 뒤 그림을 그 중의 한 칸에 넣으면 이렇게 그림이 가운데 들어간 문서 를 작성할 수가 있는 것입니다.


오궁패밀리 가족 사진

이런 방법을 사용하면 매우 다양한 형태의 문서를 만들 수가 있습니다. 실제로 인터넷 문서 중에서 표가 포함되지 않는 문서가 잘 없을 정도입니다. 지금 당장 마우스 오른쪽 버턴을 눌러 소스 보기를해 보십시오. 합창단 게시판 에도 table 형식의 문서가 많이 포함되어 있음을 알 수 있을 것입니다.


자 오늘은 이 표에 대해서 알아 보려고 합니다.

위와 같이 말입니다. 그리고 이제는 표의 테두리를 없애 버리면
 

저희 가족 홈페이지 사진을 이용해서 한 번 설명해 볼까요?
아래의 그림은 저희 가족이 모두 모여 찍은 사진입니다.

이 사진을 글의 중간에 위치시키고 설명을 이렇게 집어 넣으려고 하면 딴 방법으로는 쉽지가 않습니다 그러나 표를 사용해서 화면을 여러개의 칸으로나눈 뒤 그림을 그 중의 한 칸에 넣으면 이렇게 그림이 가운데 들어간 문서를 작성할 수가 있는 것입니다.


오궁패밀리 가족 사진

이런 방법을 사용하면 매우 다양한 형태의 문서를 만들 수가 있습니다. 실제로 인터넷 문서 중에서 표가 포함되지 않는 문서가 잘 없을 정도입니다. 지금 당장 마우스 오른쪽 버턴을 눌러 소스 보기를해 보십시오. 합창단 게시판 에도 table 형식의 문서가 많이 포함되어 있음을 알 수 있을 것입니다.


자 오늘은 이 표에 대해서 알아 보려고 합니다.

위와 같이 될 것입니다. 표를 이용하지 않고서는 이런 화면을 얻기가 힘들겁니다.

자 이제 차근차근 알아보도록 할까요?

기본적인 테이블 만들기

우리가 표를 그릴 때 좌우, 상하로 줄을 긋죠?
HTML문서에서는 이런 선의 역할을 하는 태그가 있습니다. 그러면 테이블을 구성하는 태그를 알아 볼까요?
 <table> </table> : 표의 시작과 끝을 을 알리는 태그입니다. 이 태그는 단독으로 쓰이지 않고 반드시 <tr><td>등의 태그와 함께 쓰입니다. 즉 <table> 내용 </table> 이렇게 적는다고 해서 표가 그려지지 않는다는 것이죠.
<tr></tr> : table row의 약자로 표의 가로줄을 표시하는 태그입니다.
<td></td> : table data의 약자로 표의 세로줄을 표시하는 태그입니다. 이 두 개 태그 사이에 있는 내용이 표 속의 한 개의 셀 속에 들어가게 됩니다.

자 그럼 이 태그들이 실제의 표에서 어떻게 사용되는지 한 번 볼까요?

<table>
                <tr>
                    <td>

                         표의 내용

                    </td>
               </tr>
 </table>

 

 ☞

 

 표의 내용

 

기본적인 표는 위와 같이 구성되어 있습니다. 왼쪽과 같이 적어 넣으면 오른쪽처럼 줄과 칸이 하나씩 있는 표가 하나 만들어 집니다. 물론 위에서 처럼 줄과 칸을 뛰우지 않고 그냥
<table><tr><td>표의 내용</td></tr></table> 이렇게 적어 넣어도 같은 결과가 나오긴 합니다. 그러나 위에서 적은 것 처럼 적어 놓으면 알아보기가 훨씬 쉽습니다.

위의 내용을 자세히 살펴 보겠습니다.
표를 구성하는 줄이 모두 두줄씩 그어져 있죠? 이렇게 이해하시면 쉽습니다.  
<table></table>이란 명령으로 제일 바깥 테두리가 그어집니다.
<tr>은 표의 위쪽의 가로줄을 긋는 것과 같고 </tr>은 아래쪽의 가로줄을 긋는 것과 같습니다.
<td>는 왼쪽의 세로줄을 긋는 것과 같고 </td>는 오른쪽의 세로줄을 긋는 것과 같습니다.
하나의 셀 속에 들어갈 내용은 <td>와 </td>사이에 적어 넣으면 됩니다.

여러개의 줄과 칸을 가진 표를 만들 때도 위의 기본을 이용하면 됩니다.
칸이 하나씩 늘어날 때마다 <td></td>를 삽입하면 되고 줄이 하나씩 늘어날 때마다 <tr></tr>을 하나씩 넣어 주면 됩니다. 아래에서 그 예를 보시죠

<table>
   <tr>
       <td>첫째칸</td>
       <td>둘째칸</td>
       <td>세째칸</td>  
   </tr>
</table>

 ☞

 

첫째칸

둘째칸

세째칸

<table> </table> 명령에 따라 네모 박스 한 개를 만들고 <tr> </tr>명령에 따라 그 속에 아래 위에 가로줄을 하나씩 더 그은 다음 <td></td>가 세 번씩이니까 세 개의 칸을 만드는 가로줄을 한 칸에 좌우 두 개씩 모두 여섯 개 그어서 세 개의 칸을 가진 한 줄 짜리 표를 만드는 것이죠.

<table>
     <tr>
          <td>첫째줄첫째칸</td>
          <td>첫째줄둘째칸</td>
    </tr>
    <tr>
          <td>둘째줄첫째칸</td>
          <td>둘째줄둘째칸</td>
    </tr>
    <tr>
          <td>세째줄첫째칸</td>
          <td>세째줄둘째칸</td>
    </tr>
</table>

 ☞

 

첫째줄첫째칸 첫째줄둘째칸
둘째줄첫째칸 둘째줄둘째칸
세째줄첫째칸 세째줄둘째칸

 

테이블 속성 부여하기

이렇게 만든 테이블을 다양하게 꾸미기 위해 속성을 부여할 수 있습니다.
어떤 속성들이 쓰이는지 한 번 볼까요?

border : 테이블의 가장 바깥쪽 테두리의 두께를 설정합니다. 기본값은 '1'입니다.
숫자가 커질수록 바깥쪽 테두리가 굵어 집니다. 숫자를 '0"으로 하면 테두리가 없어지면서 표가 아닌 것 같이 보이게 됩니다. 이미 위에서 그 예를 한 번 보여 드렸죠?

width : 테이블의 폭을 설정합니다. <table> 태그에 붙혀서 사용하면 표의 전체적인 폭을 설정해 주고, <td>태그에 붙혀서 사용하면 해당 칸의 폭을 설정해 줍니다.

height : 테이블의 높이를 설정합니다. width 와 마찬가지로 <table> 태그에 붙혀서 사용하면 표의 전체적인 높이를 설정해 주고, <td>태그에 붙혀서 사용하면 해당 줄의 높이를 설정해 줍니다.

cellpadding : <table>태그에만 쓰이는 속성으로 표의 테두리와 표안의 문자간의 여백을 설정합니다.
기본값은 '1'입니다. 숫자가 증가할수록 테두리와 문자간의 여백이 많이생깁니다.

cellspacing : 역시 <table>태그에만 쓰이는 속성으로 셀과 셀 사이의 간격을 설정합니다.
위의 예에서 보듯이 일반적인 테이블은 각각의 셀은 하나의 독립된 박스로 그려지게 되고 그 셀 사이의 공간이 있습니다. 그래서 모든 선들이 두줄씩 보이게 됩니다.
cellspacing은 이 줄 사이 공간의 크기를 설정하는 속성입니다. 기본값은 '2'입니다.
만약 cellspacing을 '0'로 하게 되면 줄 사이의 공간이 없어집니다. 그래서 테이블의 선들이 두 줄이 아닌 한 줄로 보이게 됩니다.

align : 여러 가지 태그에 다양하게 이용되는 속성인데 <table>태그 안에서 사용하면 문서 내에서 그 table이 어디에 위치할 것인가를 결정해 주고, <tr>이나 <td> 태그 안에서 사용하면 해당하는 칸 속의 내용이 그 칸 내에서 어떻게 정렬할 것인가를 결정해 줍니다.
여기에 사용되는 속성값은 right, left, center가 있습니다. 이 속성에 대한 사용은 이미 딴 태그에서 공부하신 내용과 같습니다.

valign : vertical align의 약자로 <tr>이나 <td>태그에 쓰이며 셀 속의 내용이 상하로 어떻게 정렬할 것인가를 결정하는 속성값입니다.
여기에 사용되는 속성값은 top, middle, bottom이 있습니다.

bordercolor : 테이블의 선 색깔을 지정하는 속성입니다. 여기서 지정된 색깔로 모든 선의 색깔이 바뀝니다.

bordercolordark, bordercolorlight : 위의 표에서 테두리 선을 유심히 보십시오. 테두리 색깔이 약간 다르죠?
표의 테두리 선 왼쪽 바깥, 오른쪽 안쪽의 색깔은 약간 옅게 되어 있고, 테두리 선 왼쪽 안, 오른쪽 바깥은 약간 짙은 색깔로 되어 있음을 알 수 있을 것입니다.
이렇게 테이블은 기본적으로 옅은 테두리와 짙은 테두리 두 개로 나뉘어 져 있습니다. 그래서 그 테두리를 각각 따로 색깔을 설정해 줄 수 있습니다.
이럴 때 사용하는 속성이 bordercolordark와 bordercolorlight입니다. bordercolordark는 짙은 테두리, bordercolorlight는 옅은 테두리입니다.
이 속성이 사용되면 bordercolor로 일단 색을 지정해 주어도 bordercolor의 색상은 무시되고 이 속성대로 색깔이 바뀝니다.
물론 이 속성을 쓰지 않고 bordercolor만 지정해 주면 모든 선이 하나의 색깔로 바뀝니다.
그리고 이 속성은 익스플로러에만 적용이되과 넷스케이프에서는 적용이 되지 않는답니다.
복잡하죠? 어렵습니까? 그냥 이런 것도 있다는 것만 아시고 넘어가십시오. 나중에 태그 실력이 쌓이면 다시 이 내용을 한 번 보십시오. 그땐 쉬워질 겁니다.  한꺼번에 너무 많은 것을 하려면 골치아픕니다.

bgcolor : 테이블의 바탕색을 지정하는 속성입니다. <table>태그와 같이 쓰이면 테이블 전체의 색깔을, <td>나 <tr>과 함께 쓰이면 해당 셀의 바탕색을 지정해 줍니다.

<table border="1"  width="300" height="200"
                cellpadding="5" cellspacing="5">
    <tr>
        <td valign="top">첫줄첫칸</td>
        <td valign="left">첫줄두째칸</td>
   </tr>
   <tr>
        <td valign="middle">둘째줄첫칸</td>
        <td valign="center">둘째줄둘째칸</td>
   </tr>
   <tr>
        <td valign="bottom">세째줄첫칸</td>
        <td valign="right">셋째줄셋째칸</td>
   </tr>
</table>

 ☞

 

첫줄첫칸 첫줄둘째칸
둘째줄첫칸 둘째줄두째칸
세째줄첫칸 셋째줄셋째칸

위에서 예를 든 표에 비해서 줄사이의 간격이 약간 넓어졌죠? cellspacing을 넓게 지정해 줬기 때문입니다. align과 valign속성에 따라 어떻게 변하는지도 알 수 있겠죠?

bordercolor와 border두께에 gbcolor에 대해 한 번 볼까요?

 <table border="4" bordercolor="green">
     <tr>
        <td>1-1</td>
        <td>1-2</td>
        <td>1-3</td>
     </tr>
     <tr>
        <td>2-1</td>
        <td>2-2</td>
        <td>2-3</td>
     </tr>
 </table>

 ☞

 

1-1 1-2 1-3
2-1 2-2 2-3

 


border 두께를 '4'로 하니 테두리 두께가 두꺼워 졌고 선의 색깔이 녹색으로 바뀌었죠?

 

  <table border="4" bordercolordark="blue" bordercolorlight="red">
     <tr>
        <td>1-1</td>
        <td>1-2</td>
        <td>1-3</td>
     </tr>
     <tr>
        <td>2-1</td>
        <td>2-2</td>
        <td>2-3</td>
     </tr>
 </table>

 ☞

 

1-1 1-2 1-3
2-1 2-2 2-3

 


짙은 테두리를 파란색으로 옅은 테두리를 빨간색으로 설정한 예입니다.

 

 <table border="1" bordercolor="black" cellspacing="0">
     <tr>
        <td bgcolor="red">1-1</td>
        <td bgcolor="yellow">1-2</td>
        <td bgcolor="green">1-3</td>
     </tr>
     <tr>
        <td bgcolor="pink">2-1</td>
        <td bgcolor= "blue">2-2 </td>
        <td bgcolor= "white">2-3 </td>
     </tr>
 </table>

 ☞

 

1-1 1-2 1-3
2-1 2-2 2-3

 


테두리 색깔을 검은색으로하고 cellspacing을 '0'으로 하여 선들을 모두 한 줄로 만들었습니다.그리고 배경색을 여러 가지로 설정해 봤습니다.

테이블 합치기

다양한 형태의 테이블을 만들기 위해서 테이블을 합쳐야 할 경우가 많습니다.
테이블의 셀을 합치기위해서 colspan과 rowspan 속성을 사용합니다. colspan은 칸을 합치는 속성이며 rowspan은 줄을 합치는 속성 입이다. 이 속성은 <td>나 <th> 태그에만 쓰이는 것이므로, <table>태그나 <tr>태그에 쓰면 적용되지 않습니다.

아래 소스에서 colspan="2" 라는 것은 colspan이 삽입된 <td>부터 2개의 칸을 합친다는 것이며 rowspan="2" 는 rowspan이 삽입된 <td>부터 2개의 줄을 합친다는 것입니다. "3" 을 쓰면 당연히 세개가 합쳐지겠죠? 이들 속성이 테이블에서 어떤형식으로 쓰이는지 예문을 통해 알아보겠습니다.

<TABLE>
   <TR>
       <TD colSpan=2>첫줄 1,2칸</TD>
       <TD>첫줄세째칸</TD></TR>
   <TR>
       <TD rowSpan=2>2, 3줄 첫째칸</TD>
       <TD>둘째줄둘째칸</TD>
       <TD>둘째줄세째칸</TD>
   </TR>
   <TR>
       <TD>세째줄둘째칸</TD>
       <TD>세째줄세째칸</TD>
   </TR>
</TABLE>

 ☞

 

첫줄 1,2칸 첫줄세째칸
2, 3줄첫째칸 둘째줄둘째칸 둘째줄세째칸
세째줄둘째칸 세째줄세째칸

원래 테이블은 세줄 세칸의 테이블인데, 첫 줄의 1,2번째 칸을 합쳤고 2, 3째줄의 첫 번째 칸을 합친 모양입니다.
3열의 보면 첫번째 줄(<tr>)에는 두개의 <td>가 들어 있습니다. 바로 첫째칸과 둘째칸을 합쳤기 때문이겠죠?
두번째 줄(<tr>)에는 rowspan이 들어있는데도 <td> 세개가 다 있습니다. rowspan은 줄을 합치는 속성이기 때문입니다. 테이블을 보면 두 번째 줄에는 어쨋든 3개의 칸이 다 있죠?
다시 소스에서 세번째 줄(<tr>)을 보세요. 두개의 <td>만이 있습니다. 그건 두 번째 줄에서 두 번째와 세 번째 줄을  합치는 rowspan이 적용됬기 때문입니다. 즉, 세째줄첫째칸은 둘째줄의 rowspan의 명령으로 이미 만들어진거죠.
설명이 이해가 잘안가면 직접 테이블을 만들어 보세요. 몇개만 해보면 금방 알수 있을 겁니다.

테이블을 이용하여 메뉴바 만들기

세로로 길게 테이블을 만든다음 테두리를 없애고 메뉴를 정리하면 간단한 메뉴바를 만들수 있습니다.
아주 많은 웹문서에서 메뉴를 만들 때 테이블을 이용하고 있습니다.
그럼 메뉴바를 한 번 만들어 볼까요?

<table border="0" width="120" cellspacing="3" cellpadding="5">
   <tr>
      <td bgcolor="#fbf2ce" align="center"><font color="red">:::: 메뉴 ::::</font></td>
   </tr>
   <tr>
      <td bgcolor="#7a8bed" align="center"><font color="white">홈으로</font></td>
   </tr>
   <tr>
      <td bgcolor="#7a8bed" align="center"><font color="white">나의 소개</font></td>
   </tr>
   <tr>
      <td bgcolor="#7a8bed" align="center"><font color="white">링크 사이트</font></td>
   </tr>
   <tr>
      <td bgcolor="#7a8bed" align="center"><font color="white">게시판</font></td>
   </tr>
   <tr>
      <td bgcolor="#7a8bed" align="center"><font color="white">방명록</font></td>
   </tr>
   <tr>
      <td bgcolor="#7a8bed" align="center"><font color="white">E-mail</font></td>
   </tr>
</table>

 ☞

 

:::: 메뉴 ::::
홈으로
나의 소개
링크 사이트
게시판
방명록
E-mail

 

어떻습니까? 테이블이 아주 다양하고 유용하게 쓰이죠?

자 오늘은 테이블에 대하여 알아보았습니다.
어떻습니까? 간단한 것 같으면서도 복잡하죠?
원리를 잘 알고 있으면 복잡하기는 해도 크게 어려울 것은 없습니다.

복잡한 표를 일일이 HTML문서로 만드는 것은 무척 힘든 작업입니다.
그래서 사실은 이런 표 작업은 태그문자를 직접 입력하는 방법보다는 웹에디터에서 편집하는 것이 좋습니다. 거기서는 워드 프로세서에서 표작업 하듯이 길이를 늘이고 칸을 조절하고 색깔을 넣는 작업을 너무 쉽게 할 수 있기 때문입니다.
그러나 표의 기본 원리를 알고는 있는 것이 좋겠죠?
차의 정비기술이 없어도 차를 잘 운전할 수는 있지만 고장이 났을 때 고치지 못하잖아요?
그것과 같이 테이블 테그를 잘 알고 있으면 유용하게 쓰이는 경우가 많답니다. 몇 번 연습해 보시면 금방 익히실 수 있으리라 생각합니다.



  수정하기   추천하기   목록보기

번호 제목 작성자 작성일   추천 조회
215  제임스 이야기    BOF 2009/01/13 145 2119
214  부석사의 소국(小菊)    BOF 2008/11/17 176 2188
213  오궁 부부의 일본 여행기(2)  [2]  BOF 2008/09/12 136 2416
212  오궁 부부의 일본 여행기(1)  [2]  BOF 2008/09/11 133 1884
211  영주의 벚꽃    BOF 2008/04/21 157 1878
210  광양 매화 마을 꽃놀이  [1]  BOF 2008/04/17 227 2726
209  늦게 올리는 여름 휴가 사진 여행기(6) - 시드니 관광  [2]  BOF 2008/02/16 174 2295
208  늦게 올리는 여름 휴가 사진 여행기(5) - 헌터벨리,뉴카슬  [1]  BOF 2008/02/16 147 1998
207  늦게 올리는 여름 휴가 사진 여행기(4) - 헌터벨리  [1]  BOF 2008/02/15 173 2558
206  늦게 올리는 여름 휴가 사진 여행기(3) - 포트 스티븐스    BOF 2008/02/15 130 1963
205  늦게 올리는 여름 휴가 사진 여행기(2) - 뉴카슬 주변 배회하기  [2]  BOF 2008/02/13 135 1845
204  늦게 올리는 여름 휴가 사진 여행기(1) - 출발  [1]  BOF 2008/02/12 133 1945
203  가을 사진 몇 장 더...    BOF 2007/11/27 116 1727
202  가을이 깊어가는 부석사    BOF 2007/11/26 128 1749
201  하늘로 올라간 천상의 목소리    BOF 2007/09/07 201 1948
200  얼굴 큰 가족    BOF 2007/07/06 115 1653
199  최근의 재한이 집 사진들    BOF 2007/07/06 95 1515
198  여름 부석사, 그 넉넉함으로...    BOF 2007/06/25 102 1752
197  첨성대 야경    BOF 2007/04/24 104 1819
196  주말 형섭이 학교 방문    BOF 2007/04/11 106 3085
195  형섭이의 첫 귀가  [1]  BOF 2007/03/27 126 2784
194  민사고 입학식 참관기  [3]  BOF 2007/03/06 185 6581
193  오궁 패밀리의 홍콩 여행기 (3)  [1]  BOF 2007/01/05 107 2036
192  형섭이와 기타  [2]  BOF 2007/01/05 157 2054
191  홍콩 여행기 (2)  [1]  BOF 2007/01/03 103 1702
190  홍콩 여행기 (1)  [1]  BOF 2007/01/02 101 1706
189  민사고 학부모 간담회  [4]  BOF 2006/12/15 156 4936
188  윤섭이의 2006 GLPS 여름 캠프    BOF 2006/12/15 112 2617
187  눈이 왔네요 - 요즘 오궁 가족 소식    BOF 2006/11/07 169 1884
186  백암 나들이    BOF 2006/05/24 84 1003
185  윤섭이의 피아노 학원 발표회    BOF 2006/05/16 90 1410
184  주말 대게 먹기    BOF 2006/05/16 83 1629
183  오궁 가족 무비데이 '게이샤의 추억'    BOF 2006/05/05 81 1307
182  오궁 패밀리의 크리스마스 보내기    BOF 2006/02/21 141 1395
181  호주 여름 휴가기(6) - 마지막 날    BOF 2005/10/06 82 1089
180  호주 여름 휴가기(5) - 뉴카슬(Newcastle), 둘째날    BOF 2005/10/05 69 1029
179  호주 여름 휴가기(4) - 뉴카슬(Newcastle), 첫째날    BOF 2005/10/04 83 1129
178      소감: 후훗 ^^;    노윤섭 2005/10/04 119 975
177  호주 여름 휴가기(3) - 헌터 벨리(Hunter Valley)    BOF 2005/09/29 70 1034
176  호주 여름 휴가기(2) - 포트 맥쿼리(Port Macquarie)    BOF 2005/09/27 82 1138
175      소감: 호주 여름 휴가기(2) - 포트 맥쿼리(Port Macquarie)    crystal 2005/09/28 158 1133
174  호주 여름 휴가기(1)    BOF 2005/09/23 94 991
173      소감: 호주가 벌써 그리워지네요...    노윤섭 2005/09/24 143 1011
172  4자성어로 풀어본 17기 동기모임    BOF 2005/09/07 93 2138
171  잘된건지, 못된건지......    BOF 2005/07/15 135 1246
170  요즘 이런 것 드셔보셨는지?    BOF 2005/07/14 84 1304
169  제임스 가족과 함께 한 주말 이야기(2)    BOF 2005/07/08 76 1048
168  제임스 가족과 함께 한 주말 이야기(1)    BOF 2005/07/08 69 1075
167  주말에 비가 안와야 할텐데......    BOF 2005/06/30 149 1221
166  양평서 온 넥타이    BOF 2005/05/18 62 1355
165  오궁 가족 답사기 - 수원 화성    BOF 2005/04/22 71 1069
164  재흔이 돌잔치    BOF 2005/04/08 66 1399
163  광선총 오프    BOF 2005/03/29 80 1226
162  형섭이 겨울 캠프 면회 (2)    BOF 2005/01/24 121 1311
161  형섭이 겨울 캠프 면회 (1)    BOF 2005/01/24 66 1005
160  PA comment(3) from GLPS    BOF 2005/01/21 81 1327
159  형섭이 겨울 캠프 사진들(5)    BOF 2005/01/20 82 1152
158      Re: 형섭이 겨울 캠프 사진들(5)    큰외삼촌 2005/01/21 61 1037
157  Debate Comments from GLPS    BOF 2005/01/17 91 1102
156  Advisor letter from GLPS    BOF 2005/01/17 88 1200
155  PA comment(2) from GLPS  [1]  BOF 2005/01/17 80 1189
154  PA comment(1) from GLPS  [2]  BOF 2005/01/17 71 1288
153  형섭이 겨울 캠프 사진들(4)    BOF 2005/01/17 81 1099
152  형섭이 겨울 캠프 사진들(3)    BOF 2005/01/13 96 1119
151  형섭이 겨울 캠프 사진들(2)    BOF 2005/01/07 69 1237
150  형섭이 겨울 캠프 사진들(1)    BOF 2005/01/03 76 1262
149  백암 나들이    BOF 2006/05/24 96 1001
148  윤섭이의 피아노 학원 발표회    BOF 2006/05/16 89 1133
147  주말 대게 먹기    BOF 2006/05/16 95 1444
146  오궁 가족 무비데이 '게이샤의 추억'    BOF 2006/05/05 61 1475
145  오궁 패밀리의 크리스마스 보내기    BOF 2006/02/21 119 1075
144  호주 여름 휴가기(6) - 마지막 날    BOF 2005/10/06 79 1172
143  호주 여름 휴가기(5) - 뉴카슬(Newcastle), 둘째날    BOF 2005/10/05 84 1050
142  호주 여름 휴가기(4) - 뉴카슬(Newcastle), 첫째날    BOF 2005/10/04 82 1028
141      소감: 후훗 ^^;    노윤섭 2005/10/04 142 1158
140  호주 여름 휴가기(3) - 헌터 벨리(Hunter Valley)    BOF 2005/09/29 85 1139
139  호주 여름 휴가기(2) - 포트 맥쿼리(Port Macquarie)    BOF 2005/09/27 81 1159
138      소감: 호주 여름 휴가기(2) - 포트 맥쿼리(Port Macquarie)    crystal 2005/09/28 140 1181
137  호주 여름 휴가기(1)    BOF 2005/09/23 95 1055
136      소감: 호주가 벌써 그리워지네요...    노윤섭 2005/09/24 135 1053
135  4자성어로 풀어본 17기 동기모임    BOF 2005/09/07 80 1627
134  잘된건지, 못된건지......    BOF 2005/07/15 188 1328
133  요즘 이런 것 드셔보셨는지?    BOF 2005/07/14 218 1396
132  제임스 가족과 함께 한 주말 이야기(2)    BOF 2005/07/08 100 1149
131  제임스 가족과 함께 한 주말 이야기(1)    BOF 2005/07/08 79 1032
130  주말에 비가 안와야 할텐데......    BOF 2005/06/30 151 1179
129  양평서 온 넥타이    BOF 2005/05/18 77 1179
128  오궁 가족 답사기 - 수원 화성    BOF 2005/04/22 88 1349
127  재흔이 돌잔치    BOF 2005/04/08 92 1329
126  창원 집들이    BOF 2005/03/29 85 1209
125  광선총 오프    BOF 2005/03/29 89 1215
124  태그 강좌(10) - 맺는말    BOF 2005/01/17 80 1230
123  태그 강좌(9) - RGB 색상표    BOF 2005/01/17 86 1608
 태그 강좌(8) - 테이블 태그    BOF 2005/01/17 133 1821
121  태그 강좌(7) - HTML 문서와 기본 태그    BOF 2005/01/17 79 1698
120  태그 강좌(6) - 마퀴 태그    BOF 2005/01/17 88 1256
119  태그 강좌(5) - 글씨 태그    BOF 2005/01/17 56 1571
118  태그 강좌(4) - 그림태그    BOF 2005/01/17 101 1643
117  태그 강좌(3) - 어디서 연습할까요?    BOF 2005/01/17 87 1258
116  태그 강좌(2) - 음악 태그    BOF 2005/01/17 83 1090

    목록보기   이전페이지   다음페이지 [1] 2 [3][4]
       

Copyright 1999-2024 Zeroboard / skin by zero