• 돌아가기
  • 아래로
  • 위로
  • 목록
  • 댓글
HTML

<<!>td>를 간단하게 하는 <<!>col> 태그

오작교 18820

0

테이블을 많이 사용하다 보면 보통 한 테이블 안에 <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>태그에 있는 값만 바꾸어주면 되겠지요.

공유
0

댓글 쓰기 권한이 없습니다. 로그인

취소 댓글 등록

신고

"님의 댓글"

이 댓글을 신고하시겠습니까?

댓글 삭제

"님의 댓글"

삭제하시겠습니까?

목록

공유

facebooktwitterpinterestbandkakao story
번호 분류 제목 글쓴이 날짜 조회 추천
공지 HTML HTML 기초 다지기 4 오작교 08.06.17.16:26 290151 0
공지 HTML HTML과 CSS의 종합 정리 1 오작교 07.10.01.10:21 349153 0
공지 일반 스타일시트의 총정리 오작교 06.09.14.13:08 293777 +14
66 HTML
normal
오작교 15.09.17.08:58 116272 0
65 HTML
normal
오작교 15.09.13.21:38 21543 0
64 HTML
normal
오작교 15.09.13.21:30 25123 0
63 HTML
normal
오작교 15.08.30.12:19 52738 0
62 HTML
file
오작교 12.03.08.13:51 35888 0
61 HTML
normal
오작교 11.06.03.10:44 40703 0
60 HTML
normal
오작교 11.01.25.10:27 36162 0
59 HTML
normal
오작교 11.01.24.10:39 37043 0
58 HTML
normal
오작교 10.05.25.23:34 48953 0
57 HTML
normal
오작교 09.04.30.10:02 25817 0
56 HTML
normal
오작교 09.04.17.01:06 69208 0
55 HTML
normal
오작교 08.09.01.16:06 38362 0
54 HTML
normal
오작교 08.08.20.10:46 19371 0
53 HTML
normal
오작교 08.06.17.16:51 21200 0
52 HTML
normal
오작교 08.06.17.16:47 46348 0
51 HTML
normal
오작교 08.02.23.12:25 20148 0
50 HTML
normal
오작교 08.02.23.12:19 32238 0
49 HTML
normal
오작교 08.02.23.11:42 29997 0
48 HTML
normal
오작교 08.01.08.16:02 36449 0
47 HTML
normal
오작교 07.10.25.12:42 41758 0