1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
"http://www.w3.org/TR/REC-html40/strict.dtd">
<html lang=en>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>FIELDSET - Form Control Group</title>
<link rev=Made href="mailto:liam@htmlhelp.com">
<link rel=Start href="../index.html">
<link rel=StyleSheet href="../style.css" type="text/css">
<link rel=StyleSheet href="../aural.css" type="text/css" media=aural>
<link rel="Alternate StyleSheet" href="../strictHTMLonly.css" type="text/css" title="Strict HTML only">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta name="author" content="Liam Quinn">
<meta name="description" content="A description of HTML 4.0's FIELDSET element for grouping form controls.">
<meta name="keywords" content="FIELDSET, fieldset element, form, controls, control group, grouping, forms, HyperText Markup Language, HTML, HTML4, HTML 4.0, Web Design Group, WDG, <fieldset> tag, <FIELDSET> tag">
<script type="text/javascript" src="../hideNonStrict.js"></script>
</head>
<body>
<h2><img src="../wdglogo1.gif" width=250 height=83 alt="The Web Design Group"></h2>
<h1>FIELDSET - Form Control Group</h1>
<script type="text/javascript">
<!--
if (document.styleSheets && writeButton) {
writeButton("elements");
}
// -->
</script>
<table>
<tr valign=top>
<th>Syntax</th>
<td><strong class=required><FIELDSET></strong>...<strong class=required></FIELDSET></strong></td>
</tr>
<tr valign=top>
<th>Attribute Specifications</th>
<td>
<ul>
<li><a href="../attrs.html">common attributes</a></li>
</ul>
</td>
</tr>
<tr valign=top>
<th>Contents</th>
<td>A <a href="legend.html">LEGEND</a> element followed by zero or more <a href="../block.html">block-level elements</a> and <a href="../inline.html">inline elements</a></td>
</tr>
<tr valign=top>
<th>Contained in</th>
<td><span class=transitional><a href="../special/applet.html">APPLET</a>, </span><a href="../block/blockquote.html">BLOCKQUOTE</a>, <a href="../html/body.html">BODY</a>, <span class=transitional><a href="../block/center.html">CENTER</a>, </span><a href="../lists/dd.html">DD</a>, <a href="../phrase/del.html">DEL</a>, <a href="../block/div.html">DIV</a>, FIELDSET, <a href="form.html">FORM</a>, <span class=transitional><a href="../special/iframe.html">IFRAME</a>, </span><a href="../phrase/ins.html">INS</a>, <a href="../lists/li.html">LI</a>, <a href="../special/map.html">MAP</a>, <span class=transitional><a href="../frames/noframes.html">NOFRAMES</a>, </span><a href="../block/noscript.html">NOSCRIPT</a>, <a href="../special/object.html">OBJECT</a>, <a href="../tables/td.html">TD</a>, <a href="../tables/th.html">TH</a></td>
</tr>
</table>
<p>The <strong class=html>FIELDSET</strong> element defines a <em>form control group</em>. By grouping related form controls, authors can divide a form into smaller, more manageable parts, improving the usability disaster that can strike when confronting users with too many form controls. The grouping provided by <strong class=html>FIELDSET</strong> also helps the accessibility of forms to those using aural browsers by allowing these users to more easily orient themselves when filling in a large form.</p>
<p>While <strong class=html>FIELDSET</strong> is not widely supported by current browsers, it can be used safely by explicitly closing any preceding <strong class=html><a href="../block/p.html">P</a></strong> element with <strong class=html></P></strong> or by including an empty <strong class=html>P</strong> prior to the <strong class=html>FIELDSET</strong>. This causes non-supporting browsers to infer the start of a <a href="../block.html">block-level element</a> even though they ignore the block-level <strong class=html>FIELDSET</strong> element.</p>
<p>The content of a <strong class=html>FIELDSET</strong> element must begin with a <strong class=html><a href="legend.html">LEGEND</a></strong> to provide a caption for the group of controls. Following the <strong class=html>LEGEND</strong>, <strong class=html>FIELDSET</strong> may contain any <a href="../inline.html">inline</a> or <a href="../block.html">block-level</a> element, including another <strong class=html>FIELDSET</strong>.</p>
<p>An example follows:</p>
<pre class=example><code class=html><FORM METHOD=post ACTION="/cgi-bin/order.cgi">
<strong><FIELDSET></strong>
<LEGEND ACCESSKEY=I>Contact Information</LEGEND>
<TABLE>
<TR>
<TD>
<LABEL FOR=name ACCESSKEY=N>Name:</LABEL>
</TD>
<TD>
<INPUT TYPE=text NAME=name ID=name>
</TD>
</TR>
<TR>
<TD>
<LABEL FOR=email ACCESSKEY=E>E-mail Address:</LABEL>
</TD>
<TD>
<INPUT TYPE=text NAME=email ID=email>
</TD>
</TR>
<TR>
<TD>
<LABEL FOR=addr ACCESSKEY=A>Mailing Address:</LABEL>
</TD>
<TD>
<TEXTAREA NAME=address ID=addr ROWS=4 COLS=40></TEXTAREA>
</TD>
</TR>
</TABLE>
<strong></FIELDSET></strong>
<strong><FIELDSET></strong>
<LEGEND ACCESSKEY=O>Ordering Information</LEGEND>
<P>Please select the product(s) that you wish to order:</P>
<P>
<LABEL ACCESSKEY=3>
<INPUT TYPE=checkbox NAME=products VALUE="HTML 3.2 Reference">
<A HREF="/reference/wilbur/">HTML 3.2 Reference</A>
</LABEL>
<BR>
<LABEL ACCESSKEY=4>
<INPUT TYPE=checkbox NAME=products VALUE="HTML 4.0 Reference">
<A HREF="/reference/html40/">HTML 4.0 Reference</A>
</LABEL>
<BR>
<LABEL ACCESSKEY=S>
<INPUT TYPE=checkbox NAME=products VALUE="CSS Guide">
<A HREF="/reference/css/">Cascading Style Sheets Guide</A>
</LABEL>
</P>
<strong></FIELDSET></strong>
<strong><FIELDSET></strong>
<LEGEND ACCESSKEY=C>Credit Card Information</LEGEND>
<P>
<LABEL ACCESSKEY=V>
<INPUT TYPE=radio NAME=card VALUE=visa> Visa
</LABEL>
<LABEL ACCESSKEY=M>
<INPUT TYPE=radio NAME=card VALUE=mc> MasterCard
</LABEL>
<BR>
<LABEL ACCESSKEY=u>
Number: <INPUT TYPE=text NAME=number>
</LABEL>
<BR>
<LABEL ACCESSKEY=E>
Expiry: <INPUT TYPE=text NAME=expiry>
</LABEL>
</P>
<strong></FIELDSET></strong>
<P>
<INPUT TYPE=submit VALUE="Submit order">
<INPUT TYPE=reset VALUE="Clear order form">
</P>
</FORM></code></pre>
<h2>More Information</h2>
<ul>
<li><a href="http://www.w3.org/TR/REC-html40/interact/forms.html#edef-FIELDSET">FIELDSET in <abbr class=initialism title="World Wide Web Consortium">W3C</abbr> HTML4.0 Recommendation</a></li>
</ul>
<div class=footer>
<address>Maintained by <a href="http://www.htmlhelp.com/%7Eliam/">Liam Quinn</a> <<a href="mailto:liam@htmlhelp.com">liam@htmlhelp.com</a>></address>
<p class=toolbar><img src="../wdglogo-small.gif" width=105 height=40 alt="Web Design Group ~"> <a href="../index.html" rel=Start>HTML4.0Reference</a>~ <a href="../olist.html">ElementsbyFunction</a>~ <a href="../alist.html">ElementsAlphabetically</a></p>
<p class=copyright>Copyright © 1998 by <a href="http://www.htmlhelp.com/%7Eliam/">Liam Quinn</a>. This material may be distributed only subject to the terms and conditions set forth in the Open Publication License, v1.0 or later (the latest version is presently available at <a href="http://www.opencontent.org/openpub/">http://www.opencontent.org/openpub/</a>).</p>
</div>
</body>
</html>
|