File: fieldset.html

package info (click to toggle)
wdg-html-reference 4.0-2
  • links: PTS
  • area: main
  • in suites: sarge
  • size: 4,528 kB
  • ctags: 305
  • sloc: makefile: 39
file content (143 lines) | stat: -rw-r--r-- 8,095 bytes parent folder | download
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, &lt;fieldset&gt; tag, &lt;FIELDSET&gt; 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>&lt;FIELDSET&gt;</strong>...<strong class=required>&lt;/FIELDSET&gt;</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>&lt;/P&gt;</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>&lt;FORM METHOD=post ACTION="/cgi-bin/order.cgi"&gt;

  <strong>&lt;FIELDSET&gt;</strong>
    &lt;LEGEND ACCESSKEY=I&gt;Contact Information&lt;/LEGEND&gt;
    &lt;TABLE&gt;
      &lt;TR&gt;
        &lt;TD&gt;
          &lt;LABEL FOR=name ACCESSKEY=N&gt;Name:&lt;/LABEL&gt;
        &lt;/TD&gt;
        &lt;TD&gt;
          &lt;INPUT TYPE=text NAME=name ID=name&gt;
        &lt;/TD&gt;
      &lt;/TR&gt;
      &lt;TR&gt;
        &lt;TD&gt;
          &lt;LABEL FOR=email ACCESSKEY=E&gt;E-mail Address:&lt;/LABEL&gt;
        &lt;/TD&gt;
        &lt;TD&gt;
          &lt;INPUT TYPE=text NAME=email ID=email&gt;
        &lt;/TD&gt;
      &lt;/TR&gt;
      &lt;TR&gt;
        &lt;TD&gt;
          &lt;LABEL FOR=addr ACCESSKEY=A&gt;Mailing Address:&lt;/LABEL&gt;
        &lt;/TD&gt;
        &lt;TD&gt;
          &lt;TEXTAREA NAME=address ID=addr ROWS=4 COLS=40&gt;&lt;/TEXTAREA&gt;
        &lt;/TD&gt;
      &lt;/TR&gt;
    &lt;/TABLE&gt;
  <strong>&lt;/FIELDSET&gt;</strong>

  <strong>&lt;FIELDSET&gt;</strong>
    &lt;LEGEND ACCESSKEY=O&gt;Ordering Information&lt;/LEGEND&gt;
    &lt;P&gt;Please select the product(s) that you wish to order:&lt;/P&gt;
    &lt;P&gt;
      &lt;LABEL ACCESSKEY=3&gt;
        &lt;INPUT TYPE=checkbox NAME=products VALUE="HTML 3.2 Reference"&gt;
        &lt;A HREF="/reference/wilbur/"&gt;HTML 3.2 Reference&lt;/A&gt;
      &lt;/LABEL&gt;
      &lt;BR&gt;
      &lt;LABEL ACCESSKEY=4&gt;
        &lt;INPUT TYPE=checkbox NAME=products VALUE="HTML 4.0 Reference"&gt;
        &lt;A HREF="/reference/html40/"&gt;HTML 4.0 Reference&lt;/A&gt;
      &lt;/LABEL&gt;
      &lt;BR&gt;
      &lt;LABEL ACCESSKEY=S&gt;
        &lt;INPUT TYPE=checkbox NAME=products VALUE="CSS Guide"&gt;
        &lt;A HREF="/reference/css/"&gt;Cascading Style Sheets Guide&lt;/A&gt;
      &lt;/LABEL&gt;
    &lt;/P&gt;
  <strong>&lt;/FIELDSET&gt;</strong>

  <strong>&lt;FIELDSET&gt;</strong>
    &lt;LEGEND ACCESSKEY=C&gt;Credit Card Information&lt;/LEGEND&gt;
    &lt;P&gt;
      &lt;LABEL ACCESSKEY=V&gt;
        &lt;INPUT TYPE=radio NAME=card VALUE=visa&gt; Visa
      &lt;/LABEL&gt;
      &lt;LABEL ACCESSKEY=M&gt;
        &lt;INPUT TYPE=radio NAME=card VALUE=mc&gt; MasterCard
      &lt;/LABEL&gt;
      &lt;BR&gt;
      &lt;LABEL ACCESSKEY=u&gt;
        Number: &lt;INPUT TYPE=text NAME=number&gt;
      &lt;/LABEL&gt;
      &lt;BR&gt;
      &lt;LABEL ACCESSKEY=E&gt;
        Expiry: &lt;INPUT TYPE=text NAME=expiry&gt;
      &lt;/LABEL&gt;
    &lt;/P&gt;
  <strong>&lt;/FIELDSET&gt;</strong>

  &lt;P&gt;
    &lt;INPUT TYPE=submit VALUE="Submit order"&gt;
    &lt;INPUT TYPE=reset VALUE="Clear order form"&gt;
  &lt;/P&gt;

&lt;/FORM&gt;</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> &lt;<a href="mailto:liam@htmlhelp.com">liam@htmlhelp.com</a>&gt;</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 &copy; 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>