<FONT size=2><STRONG>테이블 대신 필드셋(fieldset)을 이용하기 <BR><BR><BR></STRONG>FIELDSET은 웹페이지 내 여러 개의 양식(컨트롤)들을
하나의 그룹으로 묶는 기능으로서 , <BR>LEGEND와 함께 쓸 수 있다. LEGEND는 컨트롤 묶음에 제목을 붙이는 역할을 하며,
<BR><LEGEND>는 반드시 <FIELDSET>안에서 사용해야 한다. <BR>FIELDSET과 LEGEND는 시작과
끝내는 태그로 감싸주어야 적용된다.<BR><BR><fieldset><FONT color=#0066ff><legend>
제목</legend></FONT>제목을 넣어서 fiedlset작성하기</fieldset> <BR><fieldset
<FONT color=#0066ff>style="width:50; height:30"</FONT>>필드셋 크기를 원하는 크기로
만든다.</fieldset> <BR><fieldset <FONT color=#0066ff>style="border:3 solid
#808080"</FONT>>필드셋 선의 두께와 모양, 색상을 변경하기</fieldset> <BR><fieldset
<FONT color=#0066ff>style="padding:5"</FONT>>필드셋에 여백을 만들어준다.</fieldset>
<BR><fieldset <FONT color=#0066ff>style="border-left-width:20"</FONT>>필드셋의
경계선 일부분에 두께를 변경한 경우</fieldset> <BR><BR><BR></FONT>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR vAlign=top>
<TD colSpan=3 height=25><STRONG><FONT size=2><FIELDSET>을 사용한
예제</FONT></STRONG></TD>
</TR>
<TR>
<TD vAlign=top align=right width=220 height=80>
<form name="form1">
<FIELDSET style="bgcolor: #dddddd"><BR>이름(실명) : <INPUT size=15 name=name>
<BR>전화번호 : <INPUT size=15 name=tel> <BR><BR></FIELDSET>
</form>
</TD>
<TD vAlign=top align=right width=15><FONT size=2> </FONT></TD>
<TD vAlign=top height=80>
<TABLE class=webtable style="MARGIN-TOP: -2px" cellSpacing=0 cellPadding=0
width="100%" border=0>
<TBODY>
<TR>
<TD><FONT size=2><FONT color=#0066ff><FIELDSET
style="board:1"></FONT><BR>이름(실명) : <INPUT name="name"
type="text"><BR>전화번호: <INPUT name="tel" type="text" ><BR><FONT
color=#0066ff></FIELDSET>
</FONT></FONT></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
<BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR vAlign=top>
<TD colSpan=3 height=25><FONT size=2><STRONG><FIELDSET>과 <LEGEND>을
함께 사용한 예제</STRONG> </FONT></TD>
</TR>
<TR vAlign=top>
<TD align=right width=220 height=80>
<form name="form2">
<FIELDSET><LEGEND>입력해주세요.</LEGEND><BR>이름(실명) : <INPUT size=15 name=name>
<BR>전화번호: <INPUT size=15 name=tel> <BR>e-mail: <INPUT size=15 name=e_mail ?>
<BR><BR></FIELDSET>
</form>
</TD>
<TD align=right width=15><FONT size=2> </FONT></TD>
<TD class=webtd vAlign=center height=80>
<TABLE class=webtable cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD><FONT size=2><FONT
color=#0066ff><FIELDSET><BR><LEGEND>입력해주세요.</LEGEND></FONT><BR>이름(실명)
: <INPUT name="name" type="text"><BR>전화번호: <INPUT name="tel"
type="text" ><BR>e-mail: <INPUT name="e_mail" type="text""><BR><FONT
color=#0066ff></FIELDSET></FONT></FONT></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
<BR><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR vAlign=top>
<TD colSpan=3 height=25><STRONG><FONT size=2><FIELDSET>에 스타일
적용하기</FONT></STRONG></TD>
</TR>
<TR vAlign=top>
<TD align=middle width=220 height=80>
<FIELDSET
style="BORDER-RIGHT: #f9f9f9 1px solid; BORDER-TOP: #808080 1px solid; BORDER-LEFT: #f9f9f9 1px solid; BORDER-BOTTOM: #808080 1px solid"><LEGEND
align=center><FONT color=#cc0099>필드셋의 다양한 효과</FONT></LEGEND><BR>필드셋을 이용하면
<BR>테이블을 대신하여 <BR>다양한 표현을 할수 있다.<BR><BR></FIELDSET></TD>
<TD align=middle width=15><FONT size=2></FONT></TD>
<TD vAlign=top height=80>
<TABLE class=webtable cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD><FONT size=2><FONT color=#0066ff><FIELDSET style="border:1 solid;
border-top-color: #808080; border-right-color: #f9f9f9; border-left-color:
#f9f9f9; border-bottom-color: #808080"> </FONT><BR><FONT
color=#0066ff><legend align="center">필드셋의 다양한
효과</legend></FONT><BR><br>필드셋을 이용하면 다양한 표현할 수 있다.<br><BR><FONT
color=#0066ff></FIELDSETt> </FONT></FONT></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
하나의 그룹으로 묶는 기능으로서 , <BR>LEGEND와 함께 쓸 수 있다. LEGEND는 컨트롤 묶음에 제목을 붙이는 역할을 하며,
<BR><LEGEND>는 반드시 <FIELDSET>안에서 사용해야 한다. <BR>FIELDSET과 LEGEND는 시작과
끝내는 태그로 감싸주어야 적용된다.<BR><BR><fieldset><FONT color=#0066ff><legend>
제목</legend></FONT>제목을 넣어서 fiedlset작성하기</fieldset> <BR><fieldset
<FONT color=#0066ff>style="width:50; height:30"</FONT>>필드셋 크기를 원하는 크기로
만든다.</fieldset> <BR><fieldset <FONT color=#0066ff>style="border:3 solid
#808080"</FONT>>필드셋 선의 두께와 모양, 색상을 변경하기</fieldset> <BR><fieldset
<FONT color=#0066ff>style="padding:5"</FONT>>필드셋에 여백을 만들어준다.</fieldset>
<BR><fieldset <FONT color=#0066ff>style="border-left-width:20"</FONT>>필드셋의
경계선 일부분에 두께를 변경한 경우</fieldset> <BR><BR><BR></FONT>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR vAlign=top>
<TD colSpan=3 height=25><STRONG><FONT size=2><FIELDSET>을 사용한
예제</FONT></STRONG></TD>
</TR>
<TR>
<TD vAlign=top align=right width=220 height=80>
<form name="form1">
<FIELDSET style="bgcolor: #dddddd"><BR>이름(실명) : <INPUT size=15 name=name>
<BR>전화번호 : <INPUT size=15 name=tel> <BR><BR></FIELDSET>
</form>
</TD>
<TD vAlign=top align=right width=15><FONT size=2> </FONT></TD>
<TD vAlign=top height=80>
<TABLE class=webtable style="MARGIN-TOP: -2px" cellSpacing=0 cellPadding=0
width="100%" border=0>
<TBODY>
<TR>
<TD><FONT size=2><FONT color=#0066ff><FIELDSET
style="board:1"></FONT><BR>이름(실명) : <INPUT name="name"
type="text"><BR>전화번호: <INPUT name="tel" type="text" ><BR><FONT
color=#0066ff></FIELDSET>
</FONT></FONT></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
<BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR vAlign=top>
<TD colSpan=3 height=25><FONT size=2><STRONG><FIELDSET>과 <LEGEND>을
함께 사용한 예제</STRONG> </FONT></TD>
</TR>
<TR vAlign=top>
<TD align=right width=220 height=80>
<form name="form2">
<FIELDSET><LEGEND>입력해주세요.</LEGEND><BR>이름(실명) : <INPUT size=15 name=name>
<BR>전화번호: <INPUT size=15 name=tel> <BR>e-mail: <INPUT size=15 name=e_mail ?>
<BR><BR></FIELDSET>
</form>
</TD>
<TD align=right width=15><FONT size=2> </FONT></TD>
<TD class=webtd vAlign=center height=80>
<TABLE class=webtable cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD><FONT size=2><FONT
color=#0066ff><FIELDSET><BR><LEGEND>입력해주세요.</LEGEND></FONT><BR>이름(실명)
: <INPUT name="name" type="text"><BR>전화번호: <INPUT name="tel"
type="text" ><BR>e-mail: <INPUT name="e_mail" type="text""><BR><FONT
color=#0066ff></FIELDSET></FONT></FONT></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
<BR><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR vAlign=top>
<TD colSpan=3 height=25><STRONG><FONT size=2><FIELDSET>에 스타일
적용하기</FONT></STRONG></TD>
</TR>
<TR vAlign=top>
<TD align=middle width=220 height=80>
<FIELDSET
style="BORDER-RIGHT: #f9f9f9 1px solid; BORDER-TOP: #808080 1px solid; BORDER-LEFT: #f9f9f9 1px solid; BORDER-BOTTOM: #808080 1px solid"><LEGEND
align=center><FONT color=#cc0099>필드셋의 다양한 효과</FONT></LEGEND><BR>필드셋을 이용하면
<BR>테이블을 대신하여 <BR>다양한 표현을 할수 있다.<BR><BR></FIELDSET></TD>
<TD align=middle width=15><FONT size=2></FONT></TD>
<TD vAlign=top height=80>
<TABLE class=webtable cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD><FONT size=2><FONT color=#0066ff><FIELDSET style="border:1 solid;
border-top-color: #808080; border-right-color: #f9f9f9; border-left-color:
#f9f9f9; border-bottom-color: #808080"> </FONT><BR><FONT
color=#0066ff><legend align="center">필드셋의 다양한
효과</legend></FONT><BR><br>필드셋을 이용하면 다양한 표현할 수 있다.<br><BR><FONT
color=#0066ff></FIELDSETt> </FONT></FONT></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
'Development > HTML' 카테고리의 다른 글
OBJECT 태그 사용법 (0) | 2006.12.01 |
---|---|
레이어 이동 스크립트 (0) | 2006.12.01 |
marquee 태그 (0) | 2005.08.14 |
플래시 배경 투명하게 삽입하기 (0) | 2005.08.13 |
HTML 설명 (0) | 2005.07.17 |
프레임 나뉜 페이지에서 새로고침시 페이지 유지하기 (0) | 2005.07.07 |
댓글