File: legend.html

package info (click to toggle)
wdg-html-reference 2.0-1
  • links: PTS
  • area: non-free
  • in suites: potato
  • size: 2,748 kB
  • ctags: 295
  • sloc: makefile: 41
file content (107 lines) | stat: -rw-r--r-- 6,625 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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
   "http://www.w3.org/TR/REC-html40/strict.dtd">
<html lang=en>
<head>
<title>LEGEND - Fieldset Caption</title>
<link rev=Made href="mailto:liam@htmlhelp.com">
<link rel=Start href="../index.html">
<link rel=Glossary href="../../glossary/glossary.html">
<link rel=Copyright href="../../copyright.html">
<link rel=StyleSheet href="../style.css" type="text/css">
<link rel=StyleSheet href="../aural.css" type="text/css" media=aural>
<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 LEGEND element for captioning form control groups.">
<meta name="keywords" content="LEGEND, legend element, fieldset, FIELDSET, caption, captions, captioning, header, heading, form, controls, control group, grouping, forms, HyperText Markup Language, HTML, HTML4, HTML 4.0, Web Design Group, WDG, &lt;legend&gt; tag, &lt;LEGEND&gt; tag">
<script type="text/javascript">
<!--
function toggle() {
  if (document.all.toggler.value == "Hide non-strict attributes") {
     document.styleSheets[0].addRule("div.transitional", "display:none");
     document.styleSheets[0].addRule("li.transitional", "display:none");
     document.styleSheets[0].addRule(".transitional", "speak:none");
     document.all.toggler.value = "Show non-strict attributes";
  } else {
     document.styleSheets[0].addRule("div.transitional", "display:block");
     document.styleSheets[0].addRule("li.transitional", "display:list-item");
     document.styleSheets[0].addRule(".transitional", "speak:inherit");
     document.all.toggler.value = "Hide non-strict attributes";
  }
}
// -->
</script>
</head>
<body>
<h2><img src="../wdglogo1.gif" width=250 height=83 alt="The Web Design Group"></h2>
<h1>LEGEND - Fieldset Caption</h1>
<script type="text/javascript">
<!--
  if (document.styleSheets) {
    var gt;
    gt = unescape(new String("%3E"));

    document.write("<p" + gt + "<input type=button value=\"Hide non-strict attributes\" id=toggler accesskey=s onclick=\"toggle()\"" + gt + "<\/p" + gt);
  }
// -->
</script>
<table>
  <tr valign=top>
    <th>Syntax</th>
    <td><strong class=required>&lt;LEGEND&gt;</strong>...<strong class=required>&lt;/LEGEND&gt;</strong></td>
  </tr>
  <tr valign=top>
    <th>Attribute Specifications</th>
    <td>
      <ul>
        <li>ACCESSKEY=<var><a href="../values.html#character">Character</a></var> (shortcut key)</li>
        <li class=transitional>ALIGN=[ top | bottom | left | right] (alignment relative to fieldset)</li>
        <li><a href="../attrs.html">common attributes</a></li>
      </ul>
    </td>
  </tr>
  <tr valign=top>
    <th>Contents</th>
    <td><a href="../inline.html">Inline elements</a></td>
  </tr>
  <tr valign=top>
    <th>Contained in</th>
    <td><a href="fieldset.html">FIELDSET</a></td>
  </tr>
</table>
<p>The <strong class=html>LEGEND</strong> element defines a <em>caption</em> for form controls grouped by the <strong class=html><a href="fieldset.html">FIELDSET</a></strong> element. The <strong class=html>LEGEND</strong> element must be at the start of a <strong class=html>FIELDSET</strong>, before any other elements.</p>
<p>While the <strong class=html>LEGEND</strong> element is not widely supported by current browsers, it can still be used safely if a <a href="../block.html">block-level element</a> immediately follows the <strong class=html>LEGEND</strong>. Combined with careful use of <strong class=html><a href="fieldset.html">FIELDSET</a></strong>, this will cause non-supporting browsers to render the caption as its own paragraph. Elements such as <strong class=html><a href="../phrase/strong.html">STRONG</a></strong>, <strong class=html><a href="../fontstyle/b.html">B</a></strong>, and <strong class=html><a href="../fontstyle/big.html">BIG</a></strong> could also be used to help express the meaning of <strong class=html>LEGEND</strong> to non-supporting browsers.</p>
<p>An example follows:</p>
<pre class=example><code class=html>&lt;FIELDSET&gt;
  <strong>&lt;LEGEND ACCESSKEY=C&gt;Credit Card Information&lt;/LEGEND&gt;</strong>
  &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=N&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;
&lt;/FIELDSET&gt;</code></pre>
<p><strong class=html>LEGEND</strong>'s <strong class=html>ACCESSKEY</strong> attribute, used throughout the preceding example, specifies a single Unicode character as a shortcut key for giving focus to the <strong class=html>LEGEND</strong>, allowing the user to quickly jump to a group of form controls. <a href="../entities/index.html">Entities</a> (<abbr title="for example"><i lang=la>e.g.</i></abbr> <strong class=html>&amp;eacute;</strong>) may be used as the <strong class=html>ACCESSKEY</strong> value.</p>
<div class=transitional>
<p>The <a href="../deprecated.html">deprecated</a> <strong class=html>ALIGN</strong> attribute of <strong class=html>LEGEND</strong> suggests where the caption should be positioned relative to the <strong class=html><a href="fieldset.html">FIELDSET</a></strong> on visual browsers. Possible values are <strong class=html>top</strong>, <strong class=html>bottom</strong>, <strong class=html>left</strong>, and <strong class=html>right</strong>. While <strong class=html>ALIGN</strong> is deprecated, no alternative currently exists in <a href="../../css/">Cascading Style Sheets</a>.</p>
</div>
<h2>More Information</h2>
<ul>
  <li><a href="http://www.w3.org/TR/REC-html40/interact/forms.html#edef-LEGEND">LEGEND 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><a href="http://www.htmlhelp.com/"><img src="../wdglogo-small.gif" width=105 height=40 alt="Web Design Group ~"></a> <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><a href="../../copyright.html">Copyright </a> 1998 Liam Quinn. All rights reserved.</p>
</div>
</body>
</html>