웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
테이블 테그시 <td>옵션을 쉽게 작성/변경해 봅시다
2003.01.18 02:37
테이블을 많이 사용하다 보면 보통 한 테이블 안에 <td>태그가 보통 이십개를 넘어가는 경우가 있습니다.
이러할 경우에 각 <td>에 width, align, valign, style, class, heigt 등을 각각 넣어주는데 만일 테이블을 고쳐야 할 경우에는 각각의 <td>태그안에 들어있는 값을 모두 바꾸어주어야 하는 노가다 작업을 합니다.
이러한 불편함을 없애기 위해 <col>--</col>태그를 사용해 보세요.
이 태그는 소스를 많이 차지하지 않으면서 옵션을 설정할 수가 있습니다.
예를 들면 ;
<table>
<tr>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
</tr>
<tr>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
</tr>
</table>
위의 소스를 <col>태그를 사용하면
<table>
<col align=center width=30 style=padding-left:10px; padding-right:5px;></col>
<col align=center width=30 style=padding-left:10px; padding-right:5px;></col>
<col align=center width=30 style=padding-left:10px; padding-right:5px;></col>
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
</table>
코드가 많이 줄어들게 됩니다.
물론 위의 경우는 2줄인 경우에만 예를 들었는데
세로로 여러 줄인 경우에는 훨씬 코드 작성을 용이하게 할 수 있습니다.
그리고 태그 수정시에도 각각을 수정하지 않아도 <col>태그에 있는 값만 바꾸어주면 되겠지요.
혹시 잘못된 사항이 있으면 알려주시면 도움되겠습니다.
제로보드도 이러한 식으로 코드를 많이 작성한 것으로 알고 있습니다.
========================================================================
이러할 경우에 각 <td>에 width, align, valign, style, class, heigt 등을 각각 넣어주는데 만일 테이블을 고쳐야 할 경우에는 각각의 <td>태그안에 들어있는 값을 모두 바꾸어주어야 하는 노가다 작업을 합니다.
이러한 불편함을 없애기 위해 <col>--</col>태그를 사용해 보세요.
이 태그는 소스를 많이 차지하지 않으면서 옵션을 설정할 수가 있습니다.
예를 들면 ;
<table>
<tr>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
</tr>
<tr>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
<td align=center width=30 style=padding-left:10px; padding-right:5px;>1</td>
</tr>
</table>
위의 소스를 <col>태그를 사용하면
<table>
<col align=center width=30 style=padding-left:10px; padding-right:5px;></col>
<col align=center width=30 style=padding-left:10px; padding-right:5px;></col>
<col align=center width=30 style=padding-left:10px; padding-right:5px;></col>
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
</table>
코드가 많이 줄어들게 됩니다.
물론 위의 경우는 2줄인 경우에만 예를 들었는데
세로로 여러 줄인 경우에는 훨씬 코드 작성을 용이하게 할 수 있습니다.
그리고 태그 수정시에도 각각을 수정하지 않아도 <col>태그에 있는 값만 바꾸어주면 되겠지요.
혹시 잘못된 사항이 있으면 알려주시면 도움되겠습니다.
제로보드도 이러한 식으로 코드를 많이 작성한 것으로 알고 있습니다.
========================================================================
댓글 2
제목 | 글쓴이 | 날짜 |
---|---|---|
윈도우즈 Apache 2.0 + PHP 4.4 + MySQL 5.0 설치하기 [16] | 니케 | 2007.02.10 |
진하오 php서버 v1.0 정식공개 합니다. (윈도우스용) | 좋은남자 | 2006.09.13 |
ZEROBOARD 5 세팅을 위한 리눅스 서버 APM 설치 (2006년 8월 7일버젼) [5] | 김기윤761 | 2006.08.07 |
Windows 초간단 remote 백업 명령 | 최길호 | 2006.07.14 |
단 한 줄의 명령어만 실행하여 리눅스에서 apm 설치하기 | gonom | 2006.04.14 |
apache + php + mysql + libxml (리눅스 초간단 설치) [2] | gonom | 2006.04.11 |
/var/log/secure 로그를 이용한 IP Deny 자동 등록 스크립트 | Jini | 2006.02.02 |
Message 탭 (servu4.0) | 이성헌 | 2005.12.15 |
IP access (servu4.0) | 이성헌 | 2005.12.15 |
링크설정 - mapping과 유사 (for anonymous) | 이성헌 | 2005.12.15 |
client anonymous 접속시 비번 물어볼때 (servu4.0) | 이성헌 | 2005.12.15 |
가상 디렉토리 맵핑 (servu4.0) | 이성헌 | 2005.12.15 |
새로운 도메인 설정 (servu4.0) [1] | 이성헌 | 2005.12.15 |
Activity -> user - 접속차단 위주로 설명 (servu4.0) | 이성헌 | 2005.12.15 |
FTP 서버셋팅 (servu4.0) | 이성헌 | 2005.12.15 |
Stop server (servu4.0) | 이성헌 | 2005.12.15 |
FTP 서버 등록정보 | 이성헌 | 2005.12.15 |
Setup Wizard 를 이용한 FTP 서버 설정 (servu4.0) [1] | 이성헌 | 2005.12.15 |
ftp 4.0 Mapping 설정 - 요약 | 이성헌 | 2005.12.15 |
원격 서버 관리 (servu4.0) | 이성헌 | 2005.12.15 |