컴퓨터이야기/WEB
table 태그 frame속성과 rules속성을 아십니까?
백구씨쥔장
2006. 1. 3. 10:40
[소스예제]
<table width="400" border="2" bordercolor="#CFC3B2" frame="hsides" rules="rows" cellpadding="0" cellspacing="0" style="border-collapse:collapse;">
<tr height="28" bgcolor="#F8F4EB">
<td>번호</td>
<td>형식/제목</td>
<td>분류</td>
<td>등록일</td>
</tr>
<tr height="22">
<td>1</td>
<td>재목이지..</td>
<td>야동</td>
<td>2006-01-03</td>
</tr>
</table>
<table width="400" border="2" bordercolor="#CFC3B2" frame="hsides" rules="rows" cellpadding="0" cellspacing="0" style="border-collapse:collapse;">
<tr height="28" bgcolor="#F8F4EB">
<td>번호</td>
<td>형식/제목</td>
<td>분류</td>
<td>등록일</td>
</tr>
<tr height="22">
<td>1</td>
<td>재목이지..</td>
<td>야동</td>
<td>2006-01-03</td>
</tr>
</table>
게시판 형태의 html에 반드시 사용되는 table 태그.
table 태그 속성중 frame속성과 rules속성을 아시는지요?
이 속성은 테이블 테두리를 그릴 때, 이미지나 별도의 작업없이 간단히 테이블의 테두리를 그려줍니다.
게시판 형태 출력시 아주 유용합니다.
위 소스 그대로 html로 옮겨 테이블을 그려보겠습니다.
다음과 같이 보입니다.
깔끔하지 않습니까?
frame속성의 값으로 들어갈 수 있는 것들입니다.
String that specifies or receives one of the following values.
void : Default. All outside table borders are removed.
above : Border on the top side of the border frame is displayed.
below : Border on the bottom side of the table frame is displayed.
border : Borders on all sides of the table frame are displayed.
box : Borders on all sides of the table frame are displayed.
hsides : Borders on the top and bottom sides of the table frame are displayed.
lhs : Border on the left side of the table frame is displayed.
rhs : Border on the right side of the table frame is displayed.
vsides : Borders on the left and right sides of the table frame are displayed.
바꿔가면서 다 넣어보세요~!
그리고 다음은 rules의 속성값이 될 수 있는 것들.
String that specifies or receives one of the following values.
all : Borders are displayed on all rows and columns.
cols : Borders are displayed between all table columns.
groups : Horizontal borders are displayed between all tHead, tBody, and tFoot objects; vertical borders are displayed between all colGroup objects.
none : All interior table borders are removed.
rows : Horizontal borders are displayed between all table rows.