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

 로그인

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

제목 없음

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

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

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

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

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

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

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

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

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


오궁패밀리 가족 사진

이런 방법을 사용하면 매우 다양한 형태의 문서를 만들 수가 있습니다. 실제로 인터넷 문서 중에서 표가 포함되지 않는 문서가 잘 없을 정도입니다. 지금 당장 마우스 오른쪽 버턴을 눌러 소스 보기를해 보십시오. 합창단 게시판 에도 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문서로 만드는 것은 무척 힘든 작업입니다.
그래서 사실은 이런 표 작업은 태그문자를 직접 입력하는 방법보다는 웹에디터에서 편집하는 것이 좋습니다. 거기서는 워드 프로세서에서 표작업 하듯이 길이를 늘이고 칸을 조절하고 색깔을 넣는 작업을 너무 쉽게 할 수 있기 때문입니다.
그러나 표의 기본 원리를 알고는 있는 것이 좋겠죠?
차의 정비기술이 없어도 차를 잘 운전할 수는 있지만 고장이 났을 때 고치지 못하잖아요?
그것과 같이 테이블 테그를 잘 알고 있으면 유용하게 쓰이는 경우가 많답니다. 몇 번 연습해 보시면 금방 익히실 수 있으리라 생각합니다.



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

번호 제목 작성자 작성일   추천 조회
315  아들 군대 보내기 -- 3편 어학병    BOF 2011/07/18 201 18123
314  형섭이가 진학할 대학이 결정되었습니다.    BOF 2010/04/23 235 16922
313  The Great Aussie Bush Camp - Second Day    노형섭 2003/12/19 94 15564
312  아들 군대 보내기 -- 1편 군 입대에 관한 전반적인 사항들    BOF 2011/07/18 129 12724
311  오궁 가족 답사기 - 경복궁(1)    BOF 2004/12/14 65 8502
310  달력 이야기    BOF 2002/11/07 128 7305
309  민사고 입학식 참관기  [3]  BOF 2007/03/06 181 6353
308  코타키나발루 여행기(2)  [2]  BOF 2009/09/02 213 4945
307  아들과 함께 한 한라산 등반기    BOF 2013/06/18 106 4775
306  민사고 학부모 간담회  [4]  BOF 2006/12/15 148 4728
305  형섭이 면회 다녀 왔습니다.    BOF 2011/09/29 127 4449
304  JSA 방문기(형섭이 면회기)  [1]  BOF 2011/11/02 127 4390
303  형섭이의 성년식  [1]  BOF 2009/05/20 208 3979
302  BOF의 합창단 동기 모임    BOF 2003/09/22 80 3801
301  아들 군대 보내기 -- 2편 카투사    BOF 2011/07/18 157 3529
300  아내의 생일 선물  [2]  BOF 2009/01/15 247 3457
299  춘분과 부활절    BOF 2012/03/20 142 3316
298  코타키나발루 여행기(1)    BOF 2009/09/01 187 3250
297  오궁 패밀리의 미국 여행기-1  [1]  BOF 2010/09/01 144 3042
296  주말 형섭이 학교 방문    BOF 2007/04/11 101 2960
295  오궁 패밀리의 미국 여행기-4    BOF 2010/09/11 151 2794
294  오궁 패밀리의 미국 여행기-2  [1]  BOF 2010/09/03 148 2674
293  형섭이의 첫 귀가  [1]  BOF 2007/03/27 121 2624
292  광양 매화 마을 꽃놀이  [1]  BOF 2008/04/17 222 2592
291  탈장이 뭘까?    BOF 2001/12/12 160 2583
290  집에서 만드는 스콘 레시피  [2]  BOF 2010/02/10 206 2567
289  늦겨울 소백의 눈 꽃    BOF 2012/03/08 71 2526
288  윤섭이의 2006 GLPS 여름 캠프    BOF 2006/12/15 105 2458
287  윤섭이와 함께한 주말  [1]  BOF 2009/02/16 291 2450
286  늦게 올리는 여름 휴가 사진 여행기(4) - 헌터벨리  [1]  BOF 2008/02/15 171 2406
285  오궁 패밀리의 미국 여행기-3    BOF 2010/09/09 130 2396
284  아들과 함께 한 차마고도 트레킹 - 수허고성, 리장고성    BOF 2014/09/05 83 2393
283  오궁 부부의 일본 여행기(2)  [2]  BOF 2008/09/12 135 2293
282  오궁 가족의 1박 2일  [1]  BOF 2009/08/04 215 2270
281  초보자를 위한 사진 촬영 팁 (1)    BOF 2011/07/20 104 2244
280  스타워즈 에피소드 2 - 클론의 습격    BOF 2003/05/24 121 2237
279  형섭이 근황    BOF 2010/10/18 160 2216
278  할머니와 나    BOF 2009/10/07 342 2211
277  아들과 함께 한 차마고도 트레킹 - 호도협 둘째날    BOF 2014/08/30 89 2193
276  주왕산과 주산지의 끝물 단풍    BOF 2009/11/12 160 2167
275  늦게 올리는 여름 휴가 사진 여행기(6) - 시드니 관광  [2]  BOF 2008/02/16 170 2148
274  윤섭이의 짧은 방학  [1]  BOF 2010/08/12 168 2145
273  최고의 뮤직 에니메이션, 크리스마스의 악몽    BOF 2002/07/02 84 2145
272  존댓말 유감    BOF 2010/07/08 207 2134
271  고생 많이 한 미국 여행  [1]  BOF 2010/09/01 186 2129
270  형섭이 학교 풋볼 개막전 사진    BOF 2010/09/15 131 2121
269  글로리아 에스테판 - Live in Atlantis    BOF 2003/05/24 72 2109
268  골프 핸디캡 산정 방법 (1)    BOF 2002/05/20 100 2070
267  DTS demontration DVD #7    BOF 2003/05/24 79 2057
266  4자성어로 풀어본 17기 동기모임    BOF 2005/09/07 90 2037
265  부석사의 소국(小菊)    BOF 2008/11/17 172 2006
264  크로스 오버의 모범 - 파바로티와 친구들    BOF 2002/07/16 75 1957
263  앙코르 유적군 여행기(2) -- 타프롬, 바이욘, 반테스레이  [1]  BOF 2012/02/11 68 1947
262  제임스 이야기    BOF 2009/01/13 141 1946
261  형섭이와 기타  [2]  BOF 2007/01/05 153 1921
260  Yankee Stadium에서 Football을?    BOF 2010/11/22 151 1903
259  골프 핸디캡 산정 방법 (4)    BOF 2002/05/20 99 1883
258  늦게 올리는 여름 휴가 사진 여행기(5) - 헌터벨리,뉴카슬  [1]  BOF 2008/02/16 146 1866
257  홋카이도 여름 휴가 - 오타루    BOF 2012/09/10 89 1861
256  늦게 올리는 여름 휴가 사진 여행기(3) - 포트 스티븐스    BOF 2008/02/15 124 1856
255  형섭이 군대 갔습니다.    BOF 2011/09/29 93 1854
254  3테너 로마 공연    BOF 2001/12/12 272 1853
253  형섭이의 귀국    BOF 2011/01/18 135 1844
252  바하 - 미사 b 단조    BOF 2003/09/05 140 1840
251  하늘로 올라간 천상의 목소리    BOF 2007/09/07 199 1831
250    전국 골프장 course rating 현황    BOF 2003/03/07 76 1800
249  형섭이의 봄방학    BOF 2011/03/21 129 1799
248  늦게 올리는 여름 휴가 사진 여행기(1) - 출발  [1]  BOF 2008/02/12 127 1782
247  눈이 왔네요 - 요즘 오궁 가족 소식    BOF 2006/11/07 165 1778
246  오궁 부부의 일본 여행기(1)  [2]  BOF 2008/09/11 130 1769
245  Pavarotti 절정기의 목소리 - Gala Concert    BOF 2002/07/27 89 1760
244  군산 기행 - 근대 문화 유산을 찾아서...    BOF 2014/08/07 73 1753
243  군바리의 관심은?  [1]  BOF 2012/05/04 94 1736
242  한라산 가족 등반(1)  [1]  BOF 2013/02/19 83 1735
241  오궁 패밀리의 홍콩 여행기 (3)  [1]  BOF 2007/01/05 106 1735
240  영주의 벚꽃    BOF 2008/04/21 146 1734
239  오궁 가족 답사기 - 하회 마을    BOF 2004/05/03 89 1734
238  초보자를 위한 사진 촬영 팁 (4)    BOF 2011/07/20 106 1733
237  소백산에서 만난 야생화    BOF 2012/07/04 98 1724
236  Images of Notre Dame  [2]  BOF 2011/02/10 122 1718
235  오궁 가족 답사기 -- 소수 서원  [1]  BOF 2004/03/31 115 1718
234  엘튼 존(Elton John)-One Night Only-The Greatest Hit    BOF 2003/05/24 182 1707
233  첨성대 야경    BOF 2007/04/24 99 1699
232  늦게 올리는 여름 휴가 사진 여행기(2) - 뉴카슬 주변 배회하기  [2]  BOF 2008/02/13 133 1684
 태그 강좌(8) - 테이블 태그    BOF 2005/01/17 129 1680
230  안구 경기?    BOF 2012/03/27 96 1671
229  이 한 장의 사진!!  [1]  BOF 2012/04/17 91 1658
228  피묻은 다이아몬드    BOF 2002/04/04 55 1646
227  뱀사골-피아골 단풍 산행    BOF 2013/11/16 75 1645
226  형섭이가 보낸 '손글씨 부모님 전상서'    BOF 2011/04/29 122 1634
225  가을 사진 몇 장 더...    BOF 2007/11/27 114 1625
224  아들과 함께 한 차마고도 트레킹 - 호도협 첫째날    BOF 2014/08/30 85 1619
223  DIVA라 불리어 손색없는 女子들!!    BOF 2002/03/19 319 1604
222  가을이 깊어가는 부석사    BOF 2007/11/26 125 1602
221  John's Tasmania Tour (3)    노형섭 2003/12/05 78 1600
220  여름 부석사, 그 넉넉함으로...    BOF 2007/06/25 101 1599
219  화장실 들어갈 때 맘과 나올 때 맘이 다르다? ^^    BOF 2011/09/29 84 1598
218  아들과 함께 한 차마고도 트레킹 - 마지막 날 무후사, 마무으리!    BOF 2014/09/05 83 1592
217  태그 강좌(7) - HTML 문서와 기본 태그    BOF 2005/01/17 76 1573
216  필리핀 휴가기    BOF 2002/08/27 103 1568

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

Copyright 1999-2021 Zeroboard / skin by zero