ac2513a8ed29923c79941b50f1b53eff7b4b0a28
[WebKit-https.git] / PerformanceTests / Parser / resources / html5-8266.html
1 <!DOCTYPE html><html lang=en-US-x-hixie><title>HTML Standard</title><script>
2    var loadTimer = new Date();
3    var current_revision = "r" + "$Revision: 8266 $".substr(11);
4    current_revision = current_revision.substr(0, current_revision.length - 2);
5    var last_known_revision = current_revision;
6    function F( /* varargs... */) {
7      var fragment = document.createDocumentFragment();
8      for (var index = 0; index < arguments.length; index += 1) {
9        if (arguments[index] instanceof Array) {
10          fragment.appendChild(F.apply(this, arguments[index]));
11        } else if (typeof arguments[index] == 'string') {
12          fragment.appendChild(document.createTextNode(arguments[index]));
13        } else {
14          fragment.appendChild(arguments[index]);
15        }
16      }
17      return fragment;
18    }
19    function E(name, /* optional */ attributes /*, varargs... */) {
20      var element = document.createElement(name);
21      var index = 1;
22      if ((arguments.length > 1) && (typeof attributes != 'string') &&
23          (!(attributes instanceof Node)) && (!(attributes instanceof Array))) {
24        for (var attName in attributes) {
25          if (typeof attributes[attName] == 'boolean') {
26            if (attributes[attName])
27              element.setAttribute(attName, '');
28          } else if (typeof attributes[attName] == 'function') {
29            element[attName] = attributes[attName];
30          } else {
31            element.setAttribute(attName, attributes[attName]);
32          }
33        }
34        index = 2;
35      }
36      for (; index < arguments.length; index += 1) {
37        if (arguments[index] instanceof Array) {
38          element.appendChild(F.apply(this, arguments[index]));
39        } else if (typeof arguments[index] == 'string') {
40          element.appendChild(document.createTextNode(arguments[index]));
41        } else {
42          element.appendChild(arguments[index]);
43        }
44      }
45      return element;
46    }
47    function getCookie(name) {
48      var params = location.search.substr(1).split("&");
49      for (var index = 0; index < params.length; index++) {
50        if (params[index] == name)
51          return "1";
52        var data = params[index].split("=");
53        if (data[0] == name)
54          return unescape(data[1]);
55      }
56      var cookies = document.cookie.split("; ");
57      for (var index = 0; index < cookies.length; index++) {
58        var data = cookies[index].split("=");
59        if (data[0] == name)
60          return unescape(data[1]);
61      }
62      return null;
63    }
64    var currentAlert;
65    var currentAlertTimeout;
66    function showAlert(s, href) {
67      if (!currentAlert) {
68        currentAlert = document.createElement('div');
69        currentAlert.id = 'alert';
70        var x = document.createElement('button');
71        x.textContent = '\u2573';
72        x.onclick = closeAlert2;
73        currentAlert.appendChild(x);
74        currentAlert.appendChild(document.createElement('span'));
75        currentAlert.onmousemove = function () {
76          clearTimeout(currentAlertTimeout);
77          currentAlert.className = '';
78          currentAlertTimeout = setTimeout(closeAlert, 10000);
79        }
80        document.body.appendChild(currentAlert);
81      } else {
82        clearTimeout(currentAlertTimeout);
83        currentAlert.className = '';
84      }
85      currentAlert.lastChild.textContent = '';
86      currentAlert.lastChild.appendChild(F(s));
87      if (href) {
88        var link = document.createElement('a');
89        link.href = href;
90        link.textContent = href;
91        currentAlert.lastChild.appendChild(F(' ', link));
92      }
93      currentAlertTimeout = setTimeout(closeAlert, 10000);
94    }
95    function closeAlert() {
96      clearTimeout(currentAlertTimeout);
97      if (currentAlert) {
98        currentAlert.className = 'closed';
99        currentAlertTimeout = setTimeout(closeAlert2, 3000);
100      }
101    }
102    function closeAlert2() {
103      clearTimeout(currentAlertTimeout);
104      if (currentAlert) {
105        currentAlert.parentNode.removeChild(currentAlert);
106        currentAlert = null;
107      }
108    }
109    window.addEventListener('keydown', function (event) {
110      if (event.keyCode == 27) {
111        if (currentAlert)
112          closeAlert2();
113      } else {
114        closeAlert();
115      }
116    }, false);
117    window.addEventListener('scroll', function (event) {
118      closeAlert();
119    }, false);
120    function load(script) {
121      var e = document.createElement('script');
122      e.setAttribute('src', 'http://www.whatwg.org/specs/web-apps/current-work/' + script);
123      document.body.appendChild(e);
124    }
125   </script>
126   <!-- BEGIN WEBKIT EDITS -->
127   <!-- We inline some style sheets to get more stable numbers. -->
128   <!-- Inlining /style/specification -->
129   <style>
130    /* WHATWG Green: sRGB #3c790a, rgb(60, 121, 10) */
131
132    html { margin: 0; padding: 0; color: black; background: white; }
133    body { margin: 0; padding: 0 1em 2em 8.5em; line-height: 1.35; color: black; background: white top left repeat-y; }
134
135    @media screen {
136      html { background: #eeeeee; }
137      body { margin-bottom: 30%; border-bottom: thin solid #3c790a; }
138    }
139
140    :link { color: #00C; background: transparent }
141    :visited { color: #609; background: transparent }
142    :link:active, :visited:active { color: #C00; background: transparent }
143    :link:hover, :visited:hover { background: #ffa; }
144    code :link, code :visited { color: inherit; }
145
146    body, th, td { font-family: sans-serif, Droid Sans Fallback; }
147
148    h1, h2, h3, h4, h5, h6 { text-align: left; text-rendering: optimiseLegibility; }
149    h1, h2, h3 { color: #3c790a; background: transparent; }
150    h1 { font: 900 200% sans-serif, Droid Sans Fallback; }
151    h1.allcaps { font: 900 350% sans-serif, Droid Sans Fallback; letter-spacing: 2px; }
152    h2 { font: 800 140% sans-serif, Droid Sans Fallback; }
153    h3 { font: 800 125% sans-serif, Droid Sans Fallback; }
154    h4 { font: 800 110% sans-serif, Droid Sans Fallback; }
155    h5 { font: 800 100% sans-serif, Droid Sans Fallback; }
156    h6 { font: 600 italic 100% sans-serif, Droid Sans Fallback; }
157
158    pre { margin-left: 2em; white-space: pre-wrap; }
159    h2 { margin: 3em 0 1em 0; }
160    h3 { margin: 2.5em 0 1em 0; }
161    h4 { margin: 2.5em 0 0.75em 0; }
162    h5, h6 { margin: 2.5em 0 1em; }
163    h1 + h2, h2 + h3, h3 + h4, h4 + h5, h5 + h6,
164      h1 + div.status + h2, h2 + div.status + h3, h3 + div.status + h4, h4 + div.status + h5, h5 + div.status + h6 { margin-top: 0.5em; }
165    p { margin: 1em 0; }
166    hr { display: block; background: none; border: none; padding: 0; margin: 2em 0; height: auto; }
167    dl, dd { margin-top: 0; margin-bottom: 0; }
168    dt { margin-top: 0.75em; margin-bottom: 0.25em; clear: left; }
169    dt + dt { margin-top: 0; }
170    dd dt { margin-top: 0.25em; margin-bottom: 0; }
171    dd p, dd ol, dd ol.brief { margin-top: 0; }
172    dd dl + p, dd dl + div.status + p { margin-top: 1em; }
173    dd table + p, dd table + div.status + p { margin-top: 1em; }
174    p + * > li, p + div.status + * > li, dd li { margin: 1em 0; }
175    dt, dfn { font-weight: bold; font-style: normal; }
176    i, em, dt dfn { font-style: italic; }
177    pre, code { font-size: inherit; font-family: monospace, Droid Sans Fallback, sans-serif; font-variant: normal; }
178    pre strong { color: black; font: inherit; font-weight: bold; background: #B7EDEA; }
179    pre em { font-weight: bolder; font-style: normal; }
180    @media screen { code { color: orangered; } }
181    var sub { vertical-align: bottom; font-size: smaller; position: relative; top: 0.1em; }
182    table { border-collapse: collapse; border-style: hidden hidden none hidden; }
183    table thead, table tbody { border-bottom: solid; }
184    table tbody th { text-align: left; }
185    table tbody th:first-child { border-left: solid; }
186    table td, table th { border-left: solid; border-right: solid; border-bottom: solid thin; vertical-align: top; padding: 0.2em; }
187    blockquote { margin: 0 0 0 2em; border: 0; padding: 0; font-style: italic; }
188    ins { background: green; color: white; /* color: green; border: solid thin lime; padding: 0.3em; line-height: 1.6em; */ text-decoration: none; }
189    del { background: maroon; color: white; /* color: maroon; border: solid thin red; padding: 0.3em; line-height: 1.6em; */ text-decoration: line-through; }
190    body ins, body del { display: block; }
191    body * ins, body * del { display: inline; }
192
193    .toc dfn, h1 dfn, h2 dfn, h3 dfn, h4 dfn, h5 dfn, h6 dfn { font: inherit; }
194    img.extra, p.overview { float: right; }
195    hr.bookmark { border: dashed 2em black; background: yellow; }
196    pre::before { font: bold 0.8em sans-serif; padding: 0.5em; position: absolute; top: auto; margin: -0.703125em 0 0 -3.75em /* 1em/0.8 + 1.5em + 0.5em*2 */ ; width: 1.5em; background: inherit; border: 0.078125em; border-style: solid none solid solid; border-radius: 1em 0 0 1em; }
197    pre.idl { border: solid 0.0625em; background: #EEEEEE; color: black; padding: 0.5em 1em; }
198    pre.idl :link, pre.idl :visited { color: inherit; background: transparent; }
199    pre.idl::before { content: 'IDL'; }
200    pre.asn { border: solid 0.0625em; background: #EEEEEE; color: black; padding: 0.5em 1em; }
201    pre.asn :link, pre.asn :visited { color: inherit; background: transparent; }
202    pre.asn::before { content: 'ASN'; }
203    pre.css { border: solid 0.0625em; background: #FFFFEE; color: black; padding: 0.5em 1em; }
204    pre.css:first-line { color: #AAAA50; }
205    pre.css::before { content: 'CSS'; }
206    dl.domintro { color: green; margin: 2em 0 2em 0; padding: 0.5em 1em 0.5em 2em; border: none; background: #DDFFDD; }
207    hr + dl.domintro, div.impl + dl.domintro, hr + div.status + dl.domintro, div.impl + div.status + dl.domintro { margin-top: 2.5em; margin-bottom: 1.5em; }
208    dl.domintro dt, dl.domintro dt * { color: black; text-decoration: none; }
209    dl.domintro dd { margin: 0.5em 0 1em 2em; padding: 0; }
210    dl.domintro dd p { margin: 0.5em 0; }
211    dl.domintro:before { display: table; margin: -1em -0.5em -0.5em auto; width: auto; content: 'This box is non-normative. Implementation requirements are given below this box.'; color: black; font-style: italic; border: solid 2px; background: white; padding: 0 0.25em; }
212    dl.switch { padding-left: 2em; }
213    dl.switch > dt { text-indent: -1.5em; }
214    dl.switch > dt:before { content: '\21AA'; padding: 0 0.5em 0 0; display: inline-block; width: 1em; text-align: right; line-height: 0.5em; }
215    dl.triple { padding: 0 0 0 1em; }
216    dl.triple dt, dl.triple dd { margin: 0; display: inline }
217    dl.triple dt:after { content: ':'; }
218    dl.triple dd:after { content: '\A'; white-space: pre; }
219    .diff-old { text-decoration: line-through; color: silver; background: transparent; }
220    .diff-chg, .diff-new { text-decoration: underline; color: green; background: transparent; }
221    a .diff-new { border-bottom: 1px blue solid; }
222    tr.rare { background: #EEEEEE; color: #333333; }
223
224    figure.diagrams { border: double black; background: white; padding: 1em; }
225    figure.diagrams img { display: block; margin: 1em auto; }
226
227    h2:not(.short) { page-break-before: always; }
228    h1, h2, h3, h4, h5, h6, dt { page-break-after: avoid; }
229    hgroup h2, h1 + h2, hr + h2.no-toc { page-break-before: auto ! important; }
230
231    p  > span:not([title=""]):not([class="XXX"]):not([class="impl"]):not([class="note"]),
232    li > span:not([title=""]):not([class="XXX"]):not([class="impl"]):not([class="note"]) { border-bottom: solid #99CC99; }
233
234    .head { margin: 0 0 1em; padding: 1em 0 0 0; display: block; }
235    .head p { margin: 0; }
236    .head h1 { margin: 0; }
237    .head h2 { margin-top: 0; }
238    .head .logo { float: right; margin: 0 1em; }
239    .head .logo img { display: block; margin: 0 0 0 auto; border: none } /* remove border from top image */
240    .head dl { margin: 1em 0; }
241    p.copyright { font-size: 0.6em; font-style: oblique; margin: 0; }
242
243    body > .toc > li { margin-top: 1em; margin-bottom: 1em; }
244    body > .toc.brief > li { margin-top: 0.35em; margin-bottom: 0.35em; }
245    body > .toc > li > * { margin-bottom: 0.5em; }
246    body > .toc > li > * > li > * { margin-bottom: 0.25em; }
247    .toc, .toc li { list-style: none; }
248
249    .brief { margin-top: 1em; margin-bottom: 1em; line-height: 1.1; }
250    .brief > li { margin: 0; padding: 0; }
251    .brief > li > p, .brief > li > ol, .brief > li > ul, .brief > li > dl { 
252      margin-top: 0;
253      margin-bottom: 0;
254      padding-top: 0;
255      padding-bottom: 0;
256    }
257
258    .category-list { margin-top: -0.75em; margin-bottom: 1em; line-height: 1.5; }
259    .category-list::before { content: '\21D2\A0'; font-size: 1.2em; font-weight: 900; }
260    .category-list li { display: inline; }
261    .category-list li:not(:last-child)::after { content: ', '; }
262    .category-list li > span, .category-list li > a { text-transform: lowercase; }
263    .category-list li * { text-transform: none; } /* don't affect <code> nested in <a> */
264
265    [title=WIP], [title=TBW] { background: red; color: yellow; padding: 0.1em 0.3em; border: dotted white; margin: 0 0.7em 0 0.2em; }
266    [title=SCS] { background: green; color: white; padding: 0.1em 0.3em; border-style: none dashed; margin: 0 0.7em 0 0.2em; }
267    [title=WIP] :link, [title=WIP] :visited,
268    [title=TBW] :link, [title=TBW] :visited,
269    [title=SCS] :link, [title=SCS] :visited { background: transparent; color: inherit; }
270
271    .big-issue, .XXX { color: #E50000; background: white; border: solid red; padding: 0.5em; margin: 1em 0; }
272    .big-issue > :first-child, .XXX > :first-child { margin-top: 0; }
273    p .big-issue, p .XXX { line-height: 3em; }
274    .note { color: green; background: transparent; font-family: sans-serif, Droid Sans Fallback; }
275    .warning { color: red; background: transparent; }
276    .note, .warning { font-weight: bolder; font-style: italic; }
277    .note em, .warning em, .note i, .warning i, .note var, .warning var { font-style: normal; }
278    p.note, div.note { padding: 0.5em 2em; }
279    span.note { padding: 0 2em; }
280    .note p:first-child, .warning p:first-child { margin-top: 0; }
281    .note p:last-child, .warning p:last-child { margin-bottom: 0; }
282    dd > .note:first-child { margin-bottom: 0; }
283    .warning:before { font-style: normal; }
284
285    .tablenote { margin: 0.25em 0; }
286    .tablenote small { font-size: 0.9em; }
287
288    .XXX:before, .XXX:after { content: " ** "; position: absolute; left: 0; width: 8em; text-align: right; }
289    p.note:before { content: 'Note: '; }
290    p.warning:before { content: '\26A0 Warning! '; }
291
292    .bookkeeping:before { display: block; content: 'Bookkeeping details'; font-weight: bolder; font-style: italic; }
293    .bookkeeping { font-size: 0.8em; margin: 2em 0; }
294    .bookkeeping p { margin: 0.5em 2em; display: list-item; list-style: square; }
295    .bookkeeping dt { margin: 0.5em 2em 0; }
296    .bookkeeping dd { margin: 0 3em 0.5em; }
297
298    .critical { margin: 1em; border: double thick red; padding: 1em; background: #FFFFCC; }
299    .critical > :first-child { margin-top: 0; }
300
301    h4 { position: relative; z-index: 3; }
302    h4 + .element, h4 + div.status + .element { margin-top: -2.5em; padding-top: 2em; }
303    .element { background: #EEFFEE; color: black; margin: 0 0 1em 0.15em; padding: 0 1em 0.25em 0.75em; border-left: solid #99FF99 0.25em; position: relative; z-index: 1; }
304    .element:before { position: absolute; z-index: 2; top: 0; left: -1.15em; height: 2em; width: 0.9em; background: #EEFFEE; content: ' '; border-style: none none solid solid; border-color: #99FF99; border-width: 0.25em; }
305    .element:not(:hover) > dt > :link, .element:not(:hover) > dt > :visited { color: inherit; text-decoration: none; }
306
307    table.css-property caption { text-align: left; font: inherit; font-weight: bold; }
308    table.css-property th { font: inherit; font-style: italic; text-align: left; padding-left: 2em; }
309
310    .example { display: block; color: #222222; background: #FCFCFC; border-left: double; margin-left: 2em; padding-left: 1em; }
311    td > .example:only-child { margin: 0 0 0 0.1em; }
312
313    td.non-rectangular-cell-continuation { border-left-style: hidden; }
314    td.non-rectangular-cell-indentation { border-top-style: hidden; min-width: 2em; }
315
316    .hide { display: none }
317
318    body.dfnEnabled dfn { cursor: pointer; }
319    .dfnPanel {
320      display: inline;
321      position: absolute;
322      z-index: 10;
323      height: auto;
324      width: auto;
325      padding: 0.5em 0.75em;
326      font: small sans-serif, Droid Sans Fallback;
327      background: #DDDDDD;
328      color: black;
329      border: outset 0.2em;
330    }
331    .dfnPanel * { margin: 0; padding: 0; font: inherit; text-indent: 0; }
332    .dfnPanel :link, .dfnPanel :visited { color: black; }
333    .dfnPanel p { font-weight: bolder; }
334    .dfnPanel * + p { margin-top: 0.25em; }
335    .dfnPanel li { list-style-position: inside; }
336
337    @media aural {  
338      h1, h2, h3 { stress: 20; richness: 90 }
339      .hide { speak: none }
340      p.copyright { volume: x-soft; speech-rate: x-fast }
341      dt { pause-before: 20% }
342      code, pre { speak-punctuation: code } 
343    }
344
345    @media print {
346      html { font-size: 8pt; }
347      @page { margin: 1cm 1cm 1cm 1cm; }
348      @page :left {
349        @bottom-left {
350          font: 6pt sans-serif, Droid Sans Fallback;
351          content: counter(page);
352          padding-top: 0em;
353          vertical-align: top;
354        }
355      }
356      @page :right {
357        @bottom-right {
358          font: 6pt sans-serif, Droid Sans Fallback;
359          content: counter(page);
360          text-align: right;
361          vertical-align: top;
362          padding-top: 0em;
363        }
364      }
365      a[href^="#"]::after { font-size: 0.6em; vertical-align: super; padding: 0 0.15em 0 0.15em; content: "p" target-counter(attr(href), page); }
366      .toc a::after { font: inherit; vertical-align: baseline; padding: 0; content: leader('.') target-counter(attr(href), page); }
367      pre a[href^="#"]::after, blockquote a[href^="#"]::after { content: ""; padding: 0; }
368      table { font-size: smaller; }
369      :link, :visited { text-decoration: none; color: inherit; background: transparent; }
370    }
371
372    ul.domTree, ul.domTree ul { padding: 0 0 0 1em; margin: 0; }
373    ul.domTree li { padding: 0; margin: 0; list-style: none; position: relative; }
374    ul.domTree li li { list-style: none; }
375    ul.domTree li:first-child::before { position: absolute; top: 0; height: 0.6em; left: -0.75em; width: 0.5em; border-style: none none solid solid; content: ''; border-width: 0.1em; }
376    ul.domTree li:not(:last-child)::after { position: absolute; top: 0; bottom: -0.6em; left: -0.75em; width: 0.5em; border-style: none none solid solid; content: ''; border-width: 0.1em; }
377    ul.domTree span { font-style: italic; font-family: serif, Droid Sans Fallback; }
378    ul.domTree .t1 code { color: purple; font-weight: bold; }
379    ul.domTree .t2 { font-style: normal; font-family: monospace, Droid Sans Fallback; }
380    ul.domTree .t2 .name { color: black; font-weight: bold; }
381    ul.domTree .t2 .value { color: blue; font-weight: normal; }
382    ul.domTree .t3 code, .domTree .t4 code, .domTree .t5 code { color: gray; }
383    ul.domTree .t7 code, .domTree .t8 code { color: green; }
384    ul.domTree .t10 code { color: teal; }
385
386    :target {
387       background:         #ffa;
388       -moz-box-shadow:    0 0 25px #ffa;
389       -webkit-box-shadow: 0 0 150px #ffa;
390       box-shadow:         0 0 25px #ffa;
391    }
392
393    /*body:not(.statusEnabled) .head, body:not(.dfnEnabled) .head { background: bottom right url(http://hixie.ch/resources/images/spinner) no-repeat; }*/
394   </style>
395   <!-- END WEBKIT EDITS -->
396   <link rel=icon href=http://www.whatwg.org/images/icon><style>
397    .proposal { border: blue solid; padding: 1em; }
398    .bad, .bad *:not(.XXX) { color: gray; border-color: gray; background: transparent; }
399    #updatesStatus { display: none; }
400    #updatesStatus.relevant { display: block; position: fixed; right: 1em; top: 1em; padding: 0.5em; font: bold small sans-serif; min-width: 25em; width: 30%; max-width: 40em; height: auto; border: ridge 4px gray; background: #EEEEEE; color: black; }
401    div.head .logo { width: 11em; margin-bottom: 20em; }
402    #configUI { position: absolute; z-index: 20; top: 10em; right: 0; width: 11em; padding: 0 0.5em 0 0.5em; font-size: small; background: gray; background: rgba(32,32,32,0.9); color: white; border-radius: 1em 0 0 1em; -moz-border-radius: 1em 0 0 1em; }
403    #configUI p { margin: 0.75em 0; padding: 0.3em; }
404    #configUI p label { display: block; }
405    #configUI #updateUI, #configUI .loginUI { text-align: center; }
406    #configUI input[type=button] { display: block; margin: auto; }
407    #configUI :link, #configUI :visited { color: white; }
408    #configUI :link:hover, #configUI :visited:hover { background: transparent; }
409    #reviewer { position: fixed; bottom: 0; right: 0; padding: 0.15em 0.25em 0em 0.5em; white-space: nowrap; overflow: hidden; z-index: 30; background: gray; background: rgba(32,32,32,0.9); color: white; border-radius: 1em 0 0 0; -moz-border-radius: 1em 0 0 0; max-width: 90%; }
410    #reviewer input { max-width: 50%; }
411    #reviewer * { font-size: small; }
412    #reviewer.off > :not(:first-child) { display: none; }
413    #alert { position: fixed; top: 20%; left: 20%; right: 20%; font-size: 2em; padding: 0.5em; z-index: 40; background: gray; background: rgba(32,32,32,0.9); color: white; border-radius: 1em; -moz-border-radius: 1em; -webkit-transition: opacity 1s linear; }
414    #alert.closed { opacity: 0; }
415    #alert button { position: absolute; top: -1em; right: 2em; border-radius: 1em 1em 0 0; border: none; line-height: 0.9; color: white; background: rgb(64,64,64); font-size: 0.6em; font-weight: 900; cursor: pointer; }
416    #alert :link, #alert :visited { color: white; }
417    #alert :link:hover, #alert :visited:hover { background: transparent; }
418    @media print { #configUI { display: none; } }
419    .rfc2119 { font-variant: small-caps; text-shadow: 0 0 0.5em yellow; position: static; }
420    .rfc2119::after { position: absolute; left: 0; width: 25px; text-align: center; color: yellow; text-shadow: 0.075em 0.075em 0.2em black; }
421    .rfc2119.m\ust::after { content: '\2605'; }
422    .rfc2119.s\hould::after { content: '\2606'; }
423    [hidden] { display: none; }
424   </style><style type=text/css>
425
426    .fingerprint { float: right; }
427
428    .applies thead th > * { display: block; }
429    .applies thead code { display: block; }
430    .applies td { text-align: center; }
431    .applies .yes { background: yellow; }
432
433    .matrix, .matrix td { border: hidden; text-align: right; }
434    .matrix { margin-left: 2em; }
435
436    .vertical-summary-table tr > th[rowspan="2"]:first-child + th,
437    .vertical-summary-table tr > td[rowspan="2"]:first-child + td { border-bottom: hidden; }
438
439    .dice-example { border-collapse: collapse; border-style: hidden solid solid hidden; border-width: thin; margin-left: 3em; }
440    .dice-example caption { width: 30em; font-size: smaller; font-style: italic; padding: 0.75em 0; text-align: left; }
441    .dice-example td, .dice-example th { border: solid thin; width: 1.35em; height: 1.05em; text-align: center; padding: 0; }
442
443    td.eg { border-width: thin; text-align: center; }
444
445    #table-example-1 { border: solid thin; border-collapse: collapse; margin-left: 3em; }
446    #table-example-1 * { font-family: "Essays1743", serif; line-height: 1.01em; }
447    #table-example-1 caption { padding-bottom: 0.5em; }
448    #table-example-1 thead, #table-example-1 tbody { border: none; }
449    #table-example-1 th, #table-example-1 td { border: solid thin; }
450    #table-example-1 th { font-weight: normal; }
451    #table-example-1 td { border-style: none solid; vertical-align: top; }
452    #table-example-1 th { padding: 0.5em; vertical-align: middle; text-align: center; }
453    #table-example-1 tbody tr:first-child td { padding-top: 0.5em; }
454    #table-example-1 tbody tr:last-child td { padding-bottom: 1.5em; }
455    #table-example-1 tbody td:first-child { padding-left: 2.5em; padding-right: 0; width: 9em; }
456    #table-example-1 tbody td:first-child::after { content: leader(". "); }
457    #table-example-1 tbody td { padding-left: 2em; padding-right: 2em; }
458    #table-example-1 tbody td:first-child + td { width: 10em; }
459    #table-example-1 tbody td:first-child + td ~ td { width: 2.5em; }
460    #table-example-1 tbody td:first-child + td + td + td ~ td { width: 1.25em; }
461
462    .apple-table-examples { border: none; border-collapse: separate; border-spacing: 1.5em 0em; width: 40em; margin-left: 3em; }
463    .apple-table-examples * { font-family: "Times", serif; }
464    .apple-table-examples td, .apple-table-examples th { border: none; white-space: nowrap; padding-top: 0; padding-bottom: 0; }
465    .apple-table-examples tbody th:first-child { border-left: none; width: 100%; }
466    .apple-table-examples thead th:first-child ~ th { font-size: smaller; font-weight: bolder; border-bottom: solid 2px; text-align: center; }
467    .apple-table-examples tbody th::after, .apple-table-examples tfoot th::after { content: leader(". ") }
468    .apple-table-examples tbody th, .apple-table-examples tfoot th { font: inherit; text-align: left; }
469    .apple-table-examples td { text-align: right; vertical-align: top; }
470    .apple-table-examples.e1 tbody tr:last-child td { border-bottom: solid 1px; }
471    .apple-table-examples.e1 tbody + tbody tr:last-child td { border-bottom: double 3px; }
472    .apple-table-examples.e2 th[scope=row] { padding-left: 1em; }
473    .apple-table-examples sup { line-height: 0; }
474
475    .three-column-nowrap tr > td:first-child,
476    .three-column-nowrap tr > td:first-child + td,
477    .three-column-nowrap tr > td:first-child + td + td { white-space: nowrap; }
478
479    .details-example img { vertical-align: top; }
480
481    #base64-table {
482      white-space: nowrap;
483      font-size: 0.6em;
484      column-width: 6em;
485      column-count: 5;
486      column-gap: 1em;
487      -moz-column-width: 6em;
488      -moz-column-count: 5;
489      -moz-column-gap: 1em;
490      -webkit-column-width: 6em;
491      -webkit-column-count: 5;
492      -webkit-column-gap: 1em;
493    }
494    #base64-table thead { display: none; }
495    #base64-table * { border: none; }
496    #base64-table tbody td:first-child:after { content: ':'; }
497    #base64-table tbody td:last-child { text-align: right; }
498
499    #named-character-references-table {
500      white-space: nowrap;
501      font-size: 0.6em;
502      column-width: 30em;
503      column-gap: 1em;
504      -moz-column-width: 30em;
505      -moz-column-gap: 1em;
506      -webkit-column-width: 30em;
507      -webkit-column-gap: 1em;
508    }
509    #named-character-references-table > table > tbody > tr > td:first-child + td,
510    #named-character-references-table > table > tbody > tr > td:last-child { text-align: center; }
511    #named-character-references-table > table > tbody > tr > td:last-child:hover > span { position: absolute; top: auto; left: auto; margin-left: 0.5em; line-height: 1.2; font-size: 5em; border: outset; padding: 0.25em 0.5em; background: white; width: 1.25em; height: auto; text-align: center; }
512    #named-character-references-table > table > tbody > tr#entity-CounterClockwiseContourIntegral > td:first-child { font-size: 0.5em; }
513
514    .glyph.control { color: red; }
515
516    @font-face {
517      font-family: 'Essays1743';
518      src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743.ttf');
519    }
520    @font-face {
521      font-family: 'Essays1743';
522      font-weight: bold;
523      src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743-Bold.ttf');
524    }
525    @font-face {
526      font-family: 'Essays1743';
527      font-style: italic;
528      src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743-Italic.ttf');
529    }
530    @font-face {
531      font-family: 'Essays1743';
532      font-style: italic;
533      font-weight: bold;
534      src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743-BoldItalic.ttf');
535    }
536
537   </style><link rel=stylesheet href=data:text/css, title=Normal><link rel="stylesheet alternate" href=data:text/css,.impl%20{%20background:%20pink;%20} title="Highlight implementation-only prose">
538   <!-- BEGIN WEBKIT EDITS -->
539   <!-- We inline some style sheets to get more stable numbers. -->
540   <!-- Inlining status.css -->
541   <style>
542   .status { font: 1em sans-serif; letter-spacing: -0.05em; width: 7.2em; padding: 0.3em; position: absolute; z-index: 8; left: 0.3em; background: #EEE; color: black; display: none; }
543   .status > * { font-size: 0.6em; }
544   .status.current { position: fixed; z-index: 7; top: 20px; transition: 1s; } /* 20px is in the js file too */
545   .status[hidden] { display: block; opacity: 0.0; transition: 0.25s; }
546   .status strong { display: block; margin: -0.5em -0.5em 0.2em; padding: 0.2em 0.3em 0.25em; background: black; color: white; font-weight: normal; }
547   .status.UNKNOWN strong { background: gray; color: white; }
548   .status.TBW strong { background: red; color: white; }
549   .status.WIP strong { background: red; color: white; }
550   .status.FD strong { background: orange; color: black; }
551   .status.WD strong { background: orange; color: black; }
552   .status.CWD strong { background: red; color: yellow; }
553   .status.ATRISK strong { background: red; color: yellow; }
554   .status.LC strong { background: yellow; color: black; }
555   .status.CR strong { background: lime; color: black; }
556   .status.REC strong { background: green; color: white; }
557   .status.SPLITFD strong { background: navy; color: white; }
558   .status.SPLIT/*CR*/ strong { background: navy; color: white; }
559   .status.SPLITREC strong { background: navy; color: white; }
560   .status:after { position: absolute; top: 0; left: 100%; margin-left: -1px; content: '\25B6'; font-size: 0.6em; }
561   .status.UNKNOWN:after { color: gray }
562   .status.TBW:after { color: red }
563   .status.WIP:after { color: red }
564   .status.FD:after { color: orange }
565   .status.WD:after { color: orange }
566   .status.CWD:after { color: red }
567   .status.ATRISK:after { color: red }
568   .status.LC:after { color: yellow }
569   .status.CR:after { color: lime }
570   .status.REC:after { color: green }
571   .status.SPLITFD:after { color: navy }
572   .status.SPLIT/*CR*/:after { color: navy }
573   .status.SPLITREC:after { color: navy }
574   .status { box-shadow: 0 0 3px #999; }
575   .status:after { text-shadow: 1px 0 2px #999; }
576   .status p { margin: 0; clear: both; }
577   .status p + p { overflow: hidden; }
578   .status div.implementations { height: 34px; font: 10px/1.2em sans-serif; max-height: none; overflow: hidden; }
579   .status div.implementations:before { display: block; content: "Implementation status:"; }
580   .status div.implementations p { font-size: 16px; float: left; margin: 0; border: 2px solid transparent; padding: 1px; text-indent: -10000px; /* well that's just silly */ width: 1em; height: 1em; background: no-repeat center center; /*background-size: 1em 1em;*/ clear: none; }
581   .status div.implementations p.IE { background-image: url(http://www.w3.org/TR/2006/WD-i18n-html-tech-lang-20060721/images/iewin.gif); background-position: center left; }
582   .status div.implementations p.Firefox { background-image: url(http://www.mozilla.org/favicon.ico); }
583   .status div.implementations p.Safari { background-image: url(http://www.webkit.org/favicon.ico); }
584   .status div.implementations p.Opera { background-image: url(http://www.opera.com/favicon.ico); }
585   .status div.implementations p.Shims { background-image: url(http://upload.wikimedia.org/wikipedia/commons/b/b7/Plugin.png); }
586   .status div.implementations p.NA,
587   .status div.implementations p.UNKNOWN { opacity: 0.05; }
588   .status div.implementations p.PASS { }
589   .status div.implementations p.PARTIAL { opacity: 0.4; }
590   .status div.implementations p.NONE { background: #FEE; }
591   .status div.implementations p.BUG { border-bottom-color: red; }
592   .status div.implementations p.CRASH { border-style: dotted; border-color: black; background-color: yellow; }
593   .status .autohide { max-height: 0; opacity: 0; overflow: hidden; transition: 0.5s; }
594   .status:hover .autohide { max-height: 10em; opacity: 1.0; }
595   .status:not(:hover) div.implementations.autohide { height: 0; }
596   .status .idref > a { display: block; margin: 0.1em 0 0.2em; }
597   .status:hover { z-index: 10; }
598
599   .progress { text-decoration: blink; }
600
601   .panel { position: fixed; z-index: 9; top: 10%; left: 0; margin: auto; right: 0; width: 35em; border: double thick; background: #EEEEEE; color: black; padding: 1em; font: 1em sans-serif; max-height: 70%; overflow: auto; }
602   .panel h2 { margin: 0; text-align: center; }
603   .panel ul { min-height: 6em; }
604   .panel p { text-align: right; margin: 0; }
605   .panel form { background: transparent; color: black; margin: 0.5em -0.5em 1em; padding: 0.5em; }
606   .panel form.changed { background: yellow; color: black; }
607   .panel form p { text-align: left; margin: 1em 0 0; }
608   .panel form p:first-child { margin-top: 0; }
609   .panel form p:last-child { margin-bottom: 0; }
610   .panel form p textarea { width: 100% /* need the keyword that makes it fit to the parent here XXX */; min-height: 4em; display: block; }
611   .panel form dl { line-height: 1.5em; }
612   .panel form dt { display: inline-block; width: 20em; white-space: nowrap; text-align: right; font-weight: normal; margin: 0; padding: 0; }
613   .panel form dd { display: inline; margin: 0 0 0 1em; padding: 0; }
614   .panel form dd:after { display: block; }
615
616   body.statusEnabled .status { display: block; }
617
618   ul.checkboxes { list-style-type: none; }
619   </style>
620   <!-- END WEBKIT EDITS -->
621   <script>
622    var startedInit = 0;
623    function init() {
624      startedInit = 1;
625      if (location.search == '?slow-browser')
626        return;
627      var configUI = document.createElement('div');
628      configUI.id = 'configUI';
629      document.body.appendChild(configUI);
630      load('reviewer.js');
631      if (document.documentElement.className == "" || document.documentElement.className == "split index")
632        load('toc.js');
633      load('updater.js');
634      load('dfn.js');
635      load('status.js');
636      if (getCookie('profile') == '1')
637        document.getElementsByTagName('h2')[0].textContent += '; load: ' + (new Date() - loadTimer) + 'ms';
638    }
639    if (document.documentElement.className == "")
640      setTimeout(function () {
641        if (!startedInit)
642          showAlert("Too slow? Try reading the multipage copy of the spec instead:", "http://whatwg.org/html");
643      }, 6000);
644
645    window.addEventListener('keypress', function (event) {
646      if ((event.which == 114) && (event.metaKey)) {
647        if (!confirm('Are you sure you want to reload this page?'))
648          event.preventDefault();
649      }
650    }, false);
651
652   </script><script async defer src="//survey.g.doubleclick.net/async_survey?site=52xlbs7js527m"></script><body onload=init()>
653
654   <header class=head id=head><p><a href=http://www.whatwg.org/ class=logo><img width=101 src=/images/logo alt=WHATWG height=101></a></p>
655    <hgroup><h1 class=allcaps>HTML</h1>
656     <h2 class="no-num no-toc">Living Standard &mdash; Last Updated 11 November 2013</h2>
657    </hgroup><dl><dt><strong>Web developer edition:</strong></dt>
658     <dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
659     <dt>Multiple-page version:</dt>
660     <dd><a href=http://www.whatwg.org/specs/web-apps/current-work/multipage/>http://whatwg.org/html</a></dd>
661     <dt>One-page version:</dt>
662     <dd><a href=http://www.whatwg.org/specs/web-apps/current-work/>http://whatwg.org/c</a></dd>
663     <dt>Validators</dt>
664     <dd><a href=http://validator.whatwg.org/>http://validator.whatwg.org/</a></dd>
665     <dt>Participate:</dt>
666     <dd><a href=http://www.whatwg.org/mailing-list>whatwg@whatwg.org</a></dd>
667     <dd><a href=http://forums.whatwg.org/>http://forums.whatwg.org/</a></dd>
668     <dd><a href=http://wiki.whatwg.org/wiki/IRC>IRC: #whatwg on Freenode</a></dd>
669     <dt>FAQ:</dt>
670     <dd><a href=http://wiki.whatwg.org/wiki/FAQ>http://wiki.whatwg.org/wiki/FAQ</a></dd>
671     <dt>Version history:</dt>
672     <dd>Twitter updates: <a href=http://twitter.com/WHATWG>http://twitter.com/WHATWG</a></dd>
673     <dd>Commit-Watchers mailing list: <a href=http://lists.whatwg.org/listinfo.cgi/commit-watchers-whatwg.org>http://lists.whatwg.org/listinfo.cgi/commit-watchers-whatwg.org</a></dd>
674     <dd>Interactive Web interface: <a href=http://html5.org/tools/web-apps-tracker>http://html5.org/tools/web-apps-tracker</a></dd>
675     <dd>Subversion interface: <a href=http://svn.whatwg.org/>http://svn.whatwg.org/</a></dd>
676     <dt>Issues:</dt>
677     <dd>To view the open bugs: <a href="https://www.w3.org/Bugs/Public/buglist.cgi?query_format=advanced&amp;short_desc_type=allwordssubstr&amp;short_desc=&amp;product=WHATWG&amp;component=HTML&amp;longdesc_type=allwordssubstr&amp;longdesc=&amp;bug_file_loc_type=allwordssubstr&amp;bug_file_loc=&amp;status_whiteboard_type=allwordssubstr&amp;status_whiteboard=&amp;keywords_type=allwords&amp;keywords=&amp;bug_status=UNCONFIRMED&amp;bug_status=NEW&amp;bug_status=ASSIGNED&amp;bug_status=REOPENED&amp;emailtype1=substring&amp;email1=&amp;emailtype2=substring&amp;email2=&amp;bug_id_type=anyexact&amp;bug_id=&amp;votes=&amp;chfieldfrom=&amp;chfieldto=Now&amp;chfieldvalue=&amp;cmdtype=doit&amp;order=Reuse+same+sort+as+last+time&amp;field0-0-0=noop&amp;type0-0-0=noop&amp;value0-0-0=">HTML bug list</a></dd>
678     <dd>To file bugs, use the "submit review comments" feature at the bottom of the window</dd>
679     <dd>To send feedback by e-mail: <a href=http://www.whatwg.org/mailing-list>whatwg@whatwg.org</a></dd>
680     <dd>To view and vote on e-mail feedback: <a href=http://www.whatwg.org/issues/>http://www.whatwg.org/issues/</a></dd>
681     <dt>Editor:</dt>
682     <dd>Ian Hickson, Google, ian@hixie.ch</dd>
683    </dl><p class=copyright>&copy; Copyright 2004-2011 Apple Computer, Inc.,
684    Mozilla Foundation, and Opera Software ASA.</p>
685    <p class=copyright>You are granted a license to use, reproduce
686    and create derivative works of this document.</p>
687   </header><hr><h2 class="no-num no-toc" id=contents>Table of contents</h2>
688   
689 <!--begin-toc-->
690 <ol class=toc>
691  <li><a href=#introduction><span class=secno>1 </span>Introduction</a>
692   <ol>
693    <li><a href=#abstract><span class=secno>1.1 </span>Where does this specification fit?</a></li>
694    <li><a href=#is-this-html5?><span class=secno>1.2 </span>Is this HTML5?</a></li>
695    <li><a href=#background><span class=secno>1.3 </span>Background</a></li>
696    <li><a href=#audience><span class=secno>1.4 </span>Audience</a></li>
697    <li><a href=#scope><span class=secno>1.5 </span>Scope</a></li>
698    <li><a href=#history-1><span class=secno>1.6 </span>History</a></li>
699    <li><a href=#design-notes><span class=secno>1.7 </span>Design notes</a>
700     <ol>
701      <li><a href=#serializability-of-script-execution><span class=secno>1.7.1 </span>Serializability of script execution</a></li>
702      <li><a href=#compliance-with-other-specifications><span class=secno>1.7.2 </span>Compliance with other specifications</a></li>
703      <li><a href=#extensibility><span class=secno>1.7.3 </span>Extensibility</a></ol></li>
704    <li><a href=#html-vs-xhtml><span class=secno>1.8 </span>HTML vs XHTML</a></li>
705    <li><a href=#structure-of-this-specification><span class=secno>1.9 </span>Structure of this specification</a>
706     <ol>
707      <li><a href=#how-to-read-this-specification><span class=secno>1.9.1 </span>How to read this specification</a></li>
708      <li><a href=#typographic-conventions><span class=secno>1.9.2 </span>Typographic conventions</a></ol></li>
709    <li><a href=#fingerprint><span class=secno>1.10 </span>Privacy concerns</a></li>
710    <li><a href=#a-quick-introduction-to-html><span class=secno>1.11 </span>A quick introduction to HTML</a>
711     <ol>
712      <li><a href=#writing-secure-applications-with-html><span class=secno>1.11.1 </span>Writing secure applications with HTML</a></li>
713      <li><a href=#common-pitfalls-to-avoid-when-using-the-scripting-apis><span class=secno>1.11.2 </span>Common pitfalls to avoid when using the scripting APIs</a></ol></li>
714    <li><a href=#conformance-requirements-for-authors><span class=secno>1.12 </span>Conformance requirements for authors</a>
715     <ol>
716      <li><a href=#presentational-markup><span class=secno>1.12.1 </span>Presentational markup</a></li>
717      <li><a href=#syntax-errors><span class=secno>1.12.2 </span>Syntax errors</a></li>
718      <li><a href=#restrictions-on-content-models-and-on-attribute-values><span class=secno>1.12.3 </span>Restrictions on content models and on attribute values</a></ol></li>
719    <li><a href=#suggested-reading><span class=secno>1.13 </span>Suggested reading</a></ol></li>
720  <li><a href=#infrastructure><span class=secno>2 </span>Common infrastructure</a>
721   <ol>
722    <li><a href=#terminology><span class=secno>2.1 </span>Terminology</a>
723     <ol>
724      <li><a href=#resources><span class=secno>2.1.1 </span>Resources</a></li>
725      <li><a href=#xml><span class=secno>2.1.2 </span>XML</a></li>
726      <li><a href=#dom-trees><span class=secno>2.1.3 </span>DOM trees</a></li>
727      <li><a href=#scripting-0><span class=secno>2.1.4 </span>Scripting</a></li>
728      <li><a href=#plugins><span class=secno>2.1.5 </span>Plugins</a></li>
729      <li><a href=#encoding-terminology><span class=secno>2.1.6 </span>Character encodings</a></ol></li>
730    <li><a href=#conformance-requirements><span class=secno>2.2 </span>Conformance requirements</a>
731     <ol>
732      <li><a href=#conformance-classes><span class=secno>2.2.1 </span>Conformance classes</a></li>
733      <li><a href=#dependencies><span class=secno>2.2.2 </span>Dependencies</a></li>
734      <li><a href=#extensibility-0><span class=secno>2.2.3 </span>Extensibility</a></li>
735      <li><a href=#interactions-with-xpath-and-xslt><span class=secno>2.2.4 </span>Interactions with XPath and XSLT</a></ol></li>
736    <li><a href=#case-sensitivity-and-string-comparison><span class=secno>2.3 </span>Case-sensitivity and string comparison</a></li>
737    <li><a href=#common-microsyntaxes><span class=secno>2.4 </span>Common microsyntaxes</a>
738     <ol>
739      <li><a href=#common-parser-idioms><span class=secno>2.4.1 </span>Common parser idioms</a></li>
740      <li><a href=#boolean-attributes><span class=secno>2.4.2 </span>Boolean attributes</a></li>
741      <li><a href=#keywords-and-enumerated-attributes><span class=secno>2.4.3 </span>Keywords and enumerated attributes</a></li>
742      <li><a href=#numbers><span class=secno>2.4.4 </span>Numbers</a>
743       <ol>
744        <li><a href=#signed-integers><span class=secno>2.4.4.1 </span>Signed integers</a></li>
745        <li><a href=#non-negative-integers><span class=secno>2.4.4.2 </span>Non-negative integers</a></li>
746        <li><a href=#floating-point-numbers><span class=secno>2.4.4.3 </span>Floating-point numbers</a></li>
747        <li><a href=#percentages-and-dimensions><span class=secno>2.4.4.4 </span>Percentages and lengths</a></li>
748        <li><a href=#lists-of-integers><span class=secno>2.4.4.5 </span>Lists of integers</a></li>
749        <li><a href=#lists-of-dimensions><span class=secno>2.4.4.6 </span>Lists of dimensions</a></ol></li>
750      <li><a href=#dates-and-times><span class=secno>2.4.5 </span>Dates and times</a>
751       <ol>
752        <li><a href=#months><span class=secno>2.4.5.1 </span>Months</a></li>
753        <li><a href=#dates><span class=secno>2.4.5.2 </span>Dates</a></li>
754        <li><a href=#yearless-dates><span class=secno>2.4.5.3 </span>Yearless dates</a></li>
755        <li><a href=#times><span class=secno>2.4.5.4 </span>Times</a></li>
756        <li><a href=#local-dates-and-times><span class=secno>2.4.5.5 </span>Local dates and times</a></li>
757        <li><a href=#time-zones><span class=secno>2.4.5.6 </span>Time zones</a></li>
758        <li><a href=#global-dates-and-times><span class=secno>2.4.5.7 </span>Global dates and times</a></li>
759        <li><a href=#weeks><span class=secno>2.4.5.8 </span>Weeks</a></li>
760        <li><a href=#durations><span class=secno>2.4.5.9 </span>Durations</a></li>
761        <li><a href=#vaguer-moments-in-time><span class=secno>2.4.5.10 </span>Vaguer moments in time</a></ol></li>
762      <li><a href=#colors><span class=secno>2.4.6 </span>Colors</a></li>
763      <li><a href=#space-separated-tokens><span class=secno>2.4.7 </span>Space-separated tokens</a></li>
764      <li><a href=#comma-separated-tokens><span class=secno>2.4.8 </span>Comma-separated tokens</a></li>
765      <li><a href=#syntax-references><span class=secno>2.4.9 </span>References</a></li>
766      <li><a href=#mq><span class=secno>2.4.10 </span>Media queries</a></ol></li>
767    <li><a href=#urls><span class=secno>2.5 </span>URLs</a>
768     <ol>
769      <li><a href=#terminology-0><span class=secno>2.5.1 </span>Terminology</a></li>
770      <li><a href=#resolving-urls><span class=secno>2.5.2 </span>Resolving URLs</a></li>
771      <li><a href=#dynamic-changes-to-base-urls><span class=secno>2.5.3 </span>Dynamic changes to base URLs</a></ol></li>
772    <li><a href=#fetching-resources><span class=secno>2.6 </span>Fetching resources</a>
773     <ol>
774      <li><a href=#terminology-1><span class=secno>2.6.1 </span>Terminology</a></li>
775      <li><a href=#processing-model><span class=secno>2.6.2 </span>Processing model</a></li>
776      <li><a href=#encrypted-http-and-related-security-concerns><span class=secno>2.6.3 </span>Encrypted HTTP and related security concerns</a></li>
777      <li><a href=#content-type-sniffing><span class=secno>2.6.4 </span>Determining the type of a resource</a></li>
778      <li><a href=#extracting-character-encodings-from-meta-elements><span class=secno>2.6.5 </span>Extracting character encodings from <code>meta</code> elements</a></li>
779      <li><a href=#cors-settings-attributes><span class=secno>2.6.6 </span>CORS settings attributes</a></li>
780      <li><a href=#cors-enabled-fetch><span class=secno>2.6.7 </span>CORS-enabled fetch</a></ol></li>
781    <li><a href=#common-dom-interfaces><span class=secno>2.7 </span>Common DOM interfaces</a>
782     <ol>
783      <li><a href=#reflecting-content-attributes-in-idl-attributes><span class=secno>2.7.1 </span>Reflecting content attributes in IDL attributes</a></li>
784      <li><a href=#collections-0><span class=secno>2.7.2 </span>Collections</a>
785       <ol>
786        <li><a href=#htmlallcollection-0><span class=secno>2.7.2.1 </span>HTMLAllCollection</a></li>
787        <li><a href=#htmlformcontrolscollection-0><span class=secno>2.7.2.2 </span>HTMLFormControlsCollection</a></li>
788        <li><a href=#htmloptionscollection-0><span class=secno>2.7.2.3 </span>HTMLOptionsCollection</a></li>
789        <li><a href=#htmlpropertiescollection-0><span class=secno>2.7.2.4 </span>HTMLPropertiesCollection</a></ol></li>
790      <li><a href=#domstringmap-0><span class=secno>2.7.3 </span>DOMStringMap</a></li>
791      <li><a href=#domelementmap-0><span class=secno>2.7.4 </span>DOMElementMap</a></li>
792      <li><a href=#transferable-objects><span class=secno>2.7.5 </span>Transferable objects</a></li>
793      <li><a href=#safe-passing-of-structured-data><span class=secno>2.7.6 </span>Safe passing of structured data</a></li>
794      <li><a href=#callbacks><span class=secno>2.7.7 </span>Callbacks</a></li>
795      <li><a href=#garbage-collection><span class=secno>2.7.8 </span>Garbage collection</a></ol></li>
796    <li><a href=#namespaces><span class=secno>2.8 </span>Namespaces</a></ol></li>
797  <li><a href=#dom><span class=secno>3 </span>Semantics, structure, and APIs of HTML documents</a>
798   <ol>
799    <li><a href=#documents><span class=secno>3.1 </span>Documents</a>
800     <ol>
801      <li><a href=#the-document-object><span class=secno>3.1.1 </span>The <code>Document</code> object</a></li>
802      <li><a href=#security-document><span class=secno>3.1.2 </span>Security</a></li>
803      <li><a href=#resource-metadata-management><span class=secno>3.1.3 </span>Resource metadata management</a></li>
804      <li><a href=#dom-tree-accessors><span class=secno>3.1.4 </span>DOM tree accessors</a></li>
805      <li><a href=#loading-xml-documents><span class=secno>3.1.5 </span>Loading XML documents</a></ol></li>
806    <li><a href=#elements><span class=secno>3.2 </span>Elements</a>
807     <ol>
808      <li><a href=#semantics-0><span class=secno>3.2.1 </span>Semantics</a></li>
809      <li><a href=#elements-in-the-dom><span class=secno>3.2.2 </span>Elements in the DOM</a></li>
810      <li><a href=#element-definitions><span class=secno>3.2.3 </span>Element definitions</a>
811       <ol>
812        <li><a href=#attributes><span class=secno>3.2.3.1 </span>Attributes</a></ol></li>
813      <li><a href=#content-models><span class=secno>3.2.4 </span>Content models</a>
814       <ol>
815        <li><a href=#kinds-of-content><span class=secno>3.2.4.1 </span>Kinds of content</a>
816         <ol>
817          <li><a href=#metadata-content-0><span class=secno>3.2.4.1.1 </span>Metadata content</a></li>
818          <li><a href=#flow-content-0><span class=secno>3.2.4.1.2 </span>Flow content</a></li>
819          <li><a href=#sectioning-content-0><span class=secno>3.2.4.1.3 </span>Sectioning content</a></li>
820          <li><a href=#heading-content-0><span class=secno>3.2.4.1.4 </span>Heading content</a></li>
821          <li><a href=#phrasing-content-0><span class=secno>3.2.4.1.5 </span>Phrasing content</a></li>
822          <li><a href=#embedded-content-0><span class=secno>3.2.4.1.6 </span>Embedded content</a></li>
823          <li><a href=#interactive-content-0><span class=secno>3.2.4.1.7 </span>Interactive content</a></li>
824          <li><a href=#palpable-content-0><span class=secno>3.2.4.1.8 </span>Palpable content</a></li>
825          <li><a href=#script-supporting-elements-0><span class=secno>3.2.4.1.9 </span>Script-supporting elements</a></ol></li>
826        <li><a href=#transparent-content-models><span class=secno>3.2.4.2 </span>Transparent content models</a></li>
827        <li><a href=#paragraphs><span class=secno>3.2.4.3 </span>Paragraphs</a></ol></li>
828      <li><a href=#global-attributes><span class=secno>3.2.5 </span>Global attributes</a>
829       <ol>
830        <li><a href=#the-id-attribute><span class=secno>3.2.5.1 </span>The <code>id</code> attribute</a></li>
831        <li><a href=#the-title-attribute><span class=secno>3.2.5.2 </span>The <code title=attr-title>title</code> attribute</a></li>
832        <li><a href=#the-lang-and-xml:lang-attributes><span class=secno>3.2.5.3 </span>The <code title=attr-lang>lang</code> and <code title=attr-xml-lang>xml:lang</code> attributes</a></li>
833        <li><a href=#the-translate-attribute><span class=secno>3.2.5.4 </span>The <code title=attr-translate>translate</code> attribute</a></li>
834        <li><a href=#the-xml:base-attribute-(xml-only)><span class=secno>3.2.5.5 </span>The <code>xml:base</code> attribute (XML only)</a></li>
835        <li><a href=#the-dir-attribute><span class=secno>3.2.5.6 </span>The <code>dir</code> attribute</a></li>
836        <li><a href=#classes><span class=secno>3.2.5.7 </span>The <code>class</code> attribute</a></li>
837        <li><a href=#the-style-attribute><span class=secno>3.2.5.8 </span>The <code>style</code> attribute</a></li>
838        <li><a href=#embedding-custom-non-visible-data-with-the-data-*-attributes><span class=secno>3.2.5.9 </span>Embedding custom non-visible data with the <code title=attr-data-*>data-*</code> attributes</a></ol></li>
839      <li><a href=#requirements-relating-to-bidirectional-algorithm-formatting-characters><span class=secno>3.2.6 </span>Requirements relating to bidirectional-algorithm formatting characters</a></li>
840      <li><a href=#wai-aria><span class=secno>3.2.7 </span>WAI-ARIA</a></ol></ol></li>
841  <li><a href=#semantics><span class=secno>4 </span>The elements of HTML</a>
842   <ol>
843    <li><a href=#the-root-element><span class=secno>4.1 </span>The root element</a>
844     <ol>
845      <li><a href=#the-html-element><span class=secno>4.1.1 </span>The <code>html</code> element</a></ol></li>
846    <li><a href=#document-metadata><span class=secno>4.2 </span>Document metadata</a>
847     <ol>
848      <li><a href=#the-head-element><span class=secno>4.2.1 </span>The <code>head</code> element</a></li>
849      <li><a href=#the-title-element><span class=secno>4.2.2 </span>The <code>title</code> element</a></li>
850      <li><a href=#the-base-element><span class=secno>4.2.3 </span>The <code>base</code> element</a></li>
851      <li><a href=#the-link-element><span class=secno>4.2.4 </span>The <code>link</code> element</a></li>
852      <li><a href=#the-meta-element><span class=secno>4.2.5 </span>The <code>meta</code> element</a>
853       <ol>
854        <li><a href=#standard-metadata-names><span class=secno>4.2.5.1 </span>Standard metadata names</a></li>
855        <li><a href=#other-metadata-names><span class=secno>4.2.5.2 </span>Other metadata names</a></li>
856        <li><a href=#pragma-directives><span class=secno>4.2.5.3 </span>Pragma directives</a></li>
857        <li><a href=#other-pragma-directives><span class=secno>4.2.5.4 </span>Other pragma directives</a></li>
858        <li><a href=#charset><span class=secno>4.2.5.5 </span>Specifying the document's character encoding</a></ol></li>
859      <li><a href=#the-style-element><span class=secno>4.2.6 </span>The <code>style</code> element</a></li>
860      <li><a href=#styling><span class=secno>4.2.7 </span>Styling</a></ol></li>
861    <li><a href=#sections><span class=secno>4.3 </span>Sections</a>
862     <ol>
863      <li><a href=#the-body-element><span class=secno>4.3.1 </span>The <code>body</code> element</a></li>
864      <li><a href=#the-article-element><span class=secno>4.3.2 </span>The <code>article</code> element</a></li>
865      <li><a href=#the-section-element><span class=secno>4.3.3 </span>The <code>section</code> element</a></li>
866      <li><a href=#the-nav-element><span class=secno>4.3.4 </span>The <code>nav</code> element</a></li>
867      <li><a href=#the-aside-element><span class=secno>4.3.5 </span>The <code>aside</code> element</a></li>
868      <li><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements><span class=secno>4.3.6 </span>The <code>h1</code>, <code>h2</code>, <code>h3</code>, <code>h4</code>, <code>h5</code>, and
869   <code>h6</code> elements</a></li>
870      <li><a href=#the-hgroup-element><span class=secno>4.3.7 </span>The <code>hgroup</code> element</a></li>
871      <li><a href=#the-header-element><span class=secno>4.3.8 </span>The <code>header</code> element</a></li>
872      <li><a href=#the-footer-element><span class=secno>4.3.9 </span>The <code>footer</code> element</a></li>
873      <li><a href=#the-address-element><span class=secno>4.3.10 </span>The <code>address</code> element</a></li>
874      <li><a href=#headings-and-sections><span class=secno>4.3.11 </span>Headings and sections</a>
875       <ol>
876        <li><a href=#outlines><span class=secno>4.3.11.1 </span>Creating an outline</a></li>
877        <li><a href=#sample-outlines><span class=secno>4.3.11.2 </span>Sample outlines</a></ol></li>
878      <li><a href=#usage-summary-0><span class=secno>4.3.12 </span>Usage summary</a>
879       <ol>
880        <li><a href=#article-or-section><span class=secno>4.3.12.1 </span>Article or section?</a></ol></ol></li>
881    <li><a href=#grouping-content><span class=secno>4.4 </span>Grouping content</a>
882     <ol>
883      <li><a href=#the-p-element><span class=secno>4.4.1 </span>The <code>p</code> element</a></li>
884      <li><a href=#the-hr-element><span class=secno>4.4.2 </span>The <code>hr</code> element</a></li>
885      <li><a href=#the-pre-element><span class=secno>4.4.3 </span>The <code>pre</code> element</a></li>
886      <li><a href=#the-blockquote-element><span class=secno>4.4.4 </span>The <code>blockquote</code> element</a></li>
887      <li><a href=#the-ol-element><span class=secno>4.4.5 </span>The <code>ol</code> element</a></li>
888      <li><a href=#the-ul-element><span class=secno>4.4.6 </span>The <code>ul</code> element</a></li>
889      <li><a href=#the-li-element><span class=secno>4.4.7 </span>The <code>li</code> element</a></li>
890      <li><a href=#the-dl-element><span class=secno>4.4.8 </span>The <code>dl</code> element</a></li>
891      <li><a href=#the-dt-element><span class=secno>4.4.9 </span>The <code>dt</code> element</a></li>
892      <li><a href=#the-dd-element><span class=secno>4.4.10 </span>The <code>dd</code> element</a></li>
893      <li><a href=#the-figure-element><span class=secno>4.4.11 </span>The <code>figure</code> element</a></li>
894      <li><a href=#the-figcaption-element><span class=secno>4.4.12 </span>The <code>figcaption</code> element</a></li>
895      <li><a href=#the-main-element><span class=secno>4.4.13 </span>The <code>main</code> element</a></li>
896      <li><a href=#the-div-element><span class=secno>4.4.14 </span>The <code>div</code> element</a></ol></li>
897    <li><a href=#text-level-semantics><span class=secno>4.5 </span>Text-level semantics</a>
898     <ol>
899      <li><a href=#the-a-element><span class=secno>4.5.1 </span>The <code>a</code> element</a></li>
900      <li><a href=#the-em-element><span class=secno>4.5.2 </span>The <code>em</code> element</a></li>
901      <li><a href=#the-strong-element><span class=secno>4.5.3 </span>The <code>strong</code> element</a></li>
902      <li><a href=#the-small-element><span class=secno>4.5.4 </span>The <code>small</code> element</a></li>
903      <li><a href=#the-s-element><span class=secno>4.5.5 </span>The <code>s</code> element</a></li>
904      <li><a href=#the-cite-element><span class=secno>4.5.6 </span>The <code>cite</code> element</a></li>
905      <li><a href=#the-q-element><span class=secno>4.5.7 </span>The <code>q</code> element</a></li>
906      <li><a href=#the-dfn-element><span class=secno>4.5.8 </span>The <code>dfn</code> element</a></li>
907      <li><a href=#the-abbr-element><span class=secno>4.5.9 </span>The <code>abbr</code> element</a></li>
908      <li><a href=#the-data-element><span class=secno>4.5.10 </span>The <code>data</code> element</a></li>
909      <li><a href=#the-time-element><span class=secno>4.5.11 </span>The <code>time</code> element</a></li>
910      <li><a href=#the-code-element><span class=secno>4.5.12 </span>The <code>code</code> element</a></li>
911      <li><a href=#the-var-element><span class=secno>4.5.13 </span>The <code>var</code> element</a></li>
912      <li><a href=#the-samp-element><span class=secno>4.5.14 </span>The <code>samp</code> element</a></li>
913      <li><a href=#the-kbd-element><span class=secno>4.5.15 </span>The <code>kbd</code> element</a></li>
914      <li><a href=#the-sub-and-sup-elements><span class=secno>4.5.16 </span>The <code>sub</code> and <code>sup</code> elements</a></li>
915      <li><a href=#the-i-element><span class=secno>4.5.17 </span>The <code>i</code> element</a></li>
916      <li><a href=#the-b-element><span class=secno>4.5.18 </span>The <code>b</code> element</a></li>
917      <li><a href=#the-u-element><span class=secno>4.5.19 </span>The <code>u</code> element</a></li>
918      <li><a href=#the-mark-element><span class=secno>4.5.20 </span>The <code>mark</code> element</a></li>
919      <li><a href=#the-ruby-element><span class=secno>4.5.21 </span>The <code>ruby</code> element</a></li>
920      <li><a href=#the-rt-element><span class=secno>4.5.22 </span>The <code>rt</code> element</a></li>
921      <li><a href=#the-rp-element><span class=secno>4.5.23 </span>The <code>rp</code> element</a></li>
922      <li><a href=#the-bdi-element><span class=secno>4.5.24 </span>The <code>bdi</code> element</a></li>
923      <li><a href=#the-bdo-element><span class=secno>4.5.25 </span>The <code>bdo</code> element</a></li>
924      <li><a href=#the-span-element><span class=secno>4.5.26 </span>The <code>span</code> element</a></li>
925      <li><a href=#the-br-element><span class=secno>4.5.27 </span>The <code>br</code> element</a></li>
926      <li><a href=#the-wbr-element><span class=secno>4.5.28 </span>The <code>wbr</code> element</a></li>
927      <li><a href=#usage-summary><span class=secno>4.5.29 </span>Usage summary</a></ol></li>
928    <li><a href=#edits><span class=secno>4.6 </span>Edits</a>
929     <ol>
930      <li><a href=#the-ins-element><span class=secno>4.6.1 </span>The <code>ins</code> element</a></li>
931      <li><a href=#the-del-element><span class=secno>4.6.2 </span>The <code>del</code> element</a></li>
932      <li><a href=#attributes-common-to-ins-and-del-elements><span class=secno>4.6.3 </span>Attributes common to <code>ins</code> and <code>del</code> elements</a></li>
933      <li><a href=#edits-and-paragraphs><span class=secno>4.6.4 </span>Edits and paragraphs</a></li>
934      <li><a href=#edits-and-lists><span class=secno>4.6.5 </span>Edits and lists</a></li>
935      <li><a href=#edits-and-tables><span class=secno>4.6.6 </span>Edits and tables</a></ol></li>
936    <li><a href=#embedded-content-1><span class=secno>4.7 </span>Embedded content</a>
937     <ol>
938      <li><a href=#the-img-element><span class=secno>4.7.1 </span>The <code>img</code> element</a>
939       <ol>
940        <li><a href=#alt><span class=secno>4.7.1.1 </span>Requirements for providing text to act as an alternative for images</a>
941         <ol>
942          <li><a href=#general-guidelines><span class=secno>4.7.1.1.1 </span>General guidelines</a></li>
943          <li><a href=#a-link-or-button-containing-nothing-but-the-image><span class=secno>4.7.1.1.2 </span>A link or button containing nothing but the image</a></li>
944          <li><a href=#a-phrase-or-paragraph-with-an-alternative-graphical-representation:-charts,-diagrams,-graphs,-maps,-illustrations><span class=secno>4.7.1.1.3 </span>A phrase or paragraph with an alternative graphical representation: charts, diagrams, graphs, maps, illustrations</a></li>
945          <li><a href=#a-short-phrase-or-label-with-an-alternative-graphical-representation:-icons,-logos><span class=secno>4.7.1.1.4 </span>A short phrase or label with an alternative graphical representation: icons, logos</a></li>
946          <li><a href=#text-that-has-been-rendered-to-a-graphic-for-typographical-effect><span class=secno>4.7.1.1.5 </span>Text that has been rendered to a graphic for typographical effect</a></li>
947          <li><a href=#a-graphical-representation-of-some-of-the-surrounding-text><span class=secno>4.7.1.1.6 </span>A graphical representation of some of the surrounding text</a></li>
948          <li><a href="#a-purely-decorative-image-that-doesn't-add-any-information"><span class=secno>4.7.1.1.7 </span>A purely decorative image that doesn't add any information</a></li>
949          <li><a href=#a-group-of-images-that-form-a-single-larger-picture-with-no-links><span class=secno>4.7.1.1.8 </span>A group of images that form a single larger picture with no links</a></li>
950          <li><a href=#a-group-of-images-that-form-a-single-larger-picture-with-links><span class=secno>4.7.1.1.9 </span>A group of images that form a single larger picture with links</a></li>
951          <li><a href=#a-key-part-of-the-content><span class=secno>4.7.1.1.10 </span>A key part of the content</a></li>
952          <li><a href=#an-image-not-intended-for-the-user><span class=secno>4.7.1.1.11 </span>An image not intended for the user</a></li>
953          <li><a href=#an-image-in-an-e-mail-or-private-document-intended-for-a-specific-person-who-is-known-to-be-able-to-view-images><span class=secno>4.7.1.1.12 </span>An image in an e-mail or private document intended for a specific person who is known to be able to view images</a></li>
954          <li><a href=#guidance-for-markup-generators><span class=secno>4.7.1.1.13 </span>Guidance for markup generators</a></li>
955          <li><a href=#guidance-for-conformance-checkers><span class=secno>4.7.1.1.14 </span>Guidance for conformance checkers</a></ol></li>
956        <li><a href=#adaptive-images><span class=secno>4.7.1.2 </span>Adaptive images</a></ol></li>
957      <li><a href=#the-iframe-element><span class=secno>4.7.2 </span>The <code>iframe</code> element</a></li>
958      <li><a href=#the-embed-element><span class=secno>4.7.3 </span>The <code>embed</code> element</a></li>
959      <li><a href=#the-object-element><span class=secno>4.7.4 </span>The <code>object</code> element</a></li>
960      <li><a href=#the-param-element><span class=secno>4.7.5 </span>The <code>param</code> element</a></li>
961      <li><a href=#the-video-element><span class=secno>4.7.6 </span>The <code>video</code> element</a></li>
962      <li><a href=#the-audio-element><span class=secno>4.7.7 </span>The <code>audio</code> element</a></li>
963      <li><a href=#the-source-element><span class=secno>4.7.8 </span>The <code>source</code> element</a></li>
964      <li><a href=#the-track-element><span class=secno>4.7.9 </span>The <code>track</code> element</a></li>
965      <li><a href=#media-elements><span class=secno>4.7.10 </span>Media elements</a>
966       <ol>
967        <li><a href=#error-codes><span class=secno>4.7.10.1 </span>Error codes</a></li>
968        <li><a href=#location-of-the-media-resource><span class=secno>4.7.10.2 </span>Location of the media resource</a></li>
969        <li><a href=#mime-types><span class=secno>4.7.10.3 </span>MIME types</a></li>
970        <li><a href=#network-states><span class=secno>4.7.10.4 </span>Network states</a></li>
971        <li><a href=#loading-the-media-resource><span class=secno>4.7.10.5 </span>Loading the media resource</a></li>
972        <li><a href=#offsets-into-the-media-resource><span class=secno>4.7.10.6 </span>Offsets into the media resource</a></li>
973        <li><a href=#ready-states><span class=secno>4.7.10.7 </span>Ready states</a></li>
974        <li><a href=#playing-the-media-resource><span class=secno>4.7.10.8 </span>Playing the media resource</a></li>
975        <li><a href=#seeking><span class=secno>4.7.10.9 </span>Seeking</a></li>
976        <li><a href=#media-resources-with-multiple-media-tracks><span class=secno>4.7.10.10 </span>Media resources with multiple media tracks</a>
977         <ol>
978          <li><a href=#audiotracklist-and-videotracklist-objects><span class=secno>4.7.10.10.1 </span><code>AudioTrackList</code> and <code>VideoTrackList</code> objects</a></li>
979          <li><a href=#selecting-specific-audio-and-video-tracks-declaratively><span class=secno>4.7.10.10.2 </span>Selecting specific audio and video tracks declaratively</a></ol></li>
980        <li><a href=#synchronising-multiple-media-elements><span class=secno>4.7.10.11 </span>Synchronising multiple media elements</a>
981         <ol>
982          <li><a href=#introduction-0><span class=secno>4.7.10.11.1 </span>Introduction</a></li>
983          <li><a href=#media-controllers><span class=secno>4.7.10.11.2 </span>Media controllers</a></li>
984          <li><a href=#assigning-a-media-controller-declaratively><span class=secno>4.7.10.11.3 </span>Assigning a media controller declaratively</a></ol></li>
985        <li><a href=#timed-text-tracks><span class=secno>4.7.10.12 </span>Timed text tracks</a>
986         <ol>
987          <li><a href=#text-track-model><span class=secno>4.7.10.12.1 </span>Text track model</a></li>
988          <li><a href=#sourcing-in-band-text-tracks><span class=secno>4.7.10.12.2 </span>Sourcing in-band text tracks</a></li>
989          <li><a href=#sourcing-out-of-band-text-tracks><span class=secno>4.7.10.12.3 </span>Sourcing out-of-band text tracks</a></li>
990          <li><a href=#guidelines-for-exposing-cues-in-various-formats-as-text-track-cues><span class=secno>4.7.10.12.4 </span>Guidelines for exposing cues in various formats as text track cues</a></li>
991          <li><a href=#text-track-api><span class=secno>4.7.10.12.5 </span>Text track API</a></li>
992          <li><a href=#text-tracks-describing-chapters><span class=secno>4.7.10.12.6 </span>Text tracks describing chapters</a></li>
993          <li><a href=#cue-events><span class=secno>4.7.10.12.7 </span>Event definitions</a></ol></li>
994        <li><a href=#user-interface><span class=secno>4.7.10.13 </span>User interface</a></li>
995        <li><a href=#time-ranges><span class=secno>4.7.10.14 </span>Time ranges</a></li>
996        <li><a href=#event-definitions><span class=secno>4.7.10.15 </span>Event definitions</a></li>
997        <li><a href=#mediaevents><span class=secno>4.7.10.16 </span>Event summary</a></li>
998        <li><a href=#security-and-privacy-considerations><span class=secno>4.7.10.17 </span>Security and privacy considerations</a></li>
999        <li><a href=#best-practices-for-authors-using-media-elements><span class=secno>4.7.10.18 </span>Best practices for authors using media elements</a></li>
1000        <li><a href=#best-practices-for-implementors-of-media-elements><span class=secno>4.7.10.19 </span>Best practices for implementors of media elements</a></ol></li>
1001      <li><a href=#the-map-element><span class=secno>4.7.11 </span>The <code>map</code> element</a></li>
1002      <li><a href=#the-area-element><span class=secno>4.7.12 </span>The <code>area</code> element</a></li>
1003      <li><a href=#image-maps><span class=secno>4.7.13 </span>Image maps</a>
1004       <ol>
1005        <li><a href=#authoring><span class=secno>4.7.13.1 </span>Authoring</a></li>
1006        <li><a href=#processing-model-0><span class=secno>4.7.13.2 </span>Processing model</a></ol></li>
1007      <li><a href=#mathml><span class=secno>4.7.14 </span>MathML</a></li>
1008      <li><a href=#svg-0><span class=secno>4.7.15 </span>SVG</a></li>
1009      <li><a href=#dimension-attributes><span class=secno>4.7.16 </span>Dimension attributes</a></ol></li>
1010    <li><a href=#links><span class=secno>4.8 </span>Links</a>
1011     <ol>
1012      <li><a href=#introduction-1><span class=secno>4.8.1 </span>Introduction</a></li>
1013      <li><a href=#links-created-by-a-and-area-elements><span class=secno>4.8.2 </span>Links created by <code>a</code> and <code>area</code> elements</a></li>
1014      <li><a href=#following-hyperlinks-0><span class=secno>4.8.3 </span>Following hyperlinks</a></li>
1015      <li><a href=#downloading-resources><span class=secno>4.8.4 </span>Downloading resources</a>
1016       <ol>
1017        <li><a href=#hyperlink-auditing><span class=secno>4.8.4.1 </span>Hyperlink auditing</a></ol></li>
1018      <li><a href=#linkTypes><span class=secno>4.8.5 </span>Link types</a>
1019       <ol>
1020        <li><a href=#rel-alternate><span class=secno>4.8.5.1 </span>Link type "<code>alternate</code>"</a></li>
1021        <li><a href=#link-type-author><span class=secno>4.8.5.2 </span>Link type "<code>author</code>"</a></li>
1022        <li><a href=#link-type-bookmark><span class=secno>4.8.5.3 </span>Link type "<code>bookmark</code>"</a></li>
1023        <li><a href=#link-type-external><span class=secno>4.8.5.4 </span>Link type "<code>external</code>"</a></li>
1024        <li><a href=#link-type-help><span class=secno>4.8.5.5 </span>Link type "<code>help</code>"</a></li>
1025        <li><a href=#rel-icon><span class=secno>4.8.5.6 </span>Link type "<code>icon</code>"</a></li>
1026        <li><a href=#link-type-license><span class=secno>4.8.5.7 </span>Link type "<code>license</code>"</a></li>
1027        <li><a href=#link-type-nofollow><span class=secno>4.8.5.8 </span>Link type "<code>nofollow</code>"</a></li>
1028        <li><a href=#link-type-noreferrer><span class=secno>4.8.5.9 </span>Link type "<code>noreferrer</code>"</a></li>
1029        <li><a href=#link-type-pingback><span class=secno>4.8.5.10 </span>Link type "<code>pingback</code>"</a></li>
1030        <li><a href=#link-type-prefetch><span class=secno>4.8.5.11 </span>Link type "<code>prefetch</code>"</a></li>
1031        <li><a href=#link-type-search><span class=secno>4.8.5.12 </span>Link type "<code>search</code>"</a></li>
1032        <li><a href=#link-type-sidebar><span class=secno>4.8.5.13 </span>Link type "<code>sidebar</code>"</a></li>
1033        <li><a href=#link-type-stylesheet><span class=secno>4.8.5.14 </span>Link type "<code>stylesheet</code>"</a></li>
1034        <li><a href=#link-type-tag><span class=secno>4.8.5.15 </span>Link type "<code>tag</code>"</a></li>
1035        <li><a href=#sequential-link-types><span class=secno>4.8.5.16 </span>Sequential link types</a>
1036         <ol>
1037          <li><a href=#link-type-next><span class=secno>4.8.5.16.1 </span>Link type "<code>next</code>"</a></li>
1038          <li><a href=#link-type-prev><span class=secno>4.8.5.16.2 </span>Link type "<code>prev</code>"</a></ol></li>
1039        <li><a href=#other-link-types><span class=secno>4.8.5.17 </span>Other link types</a></ol></ol></li>
1040    <li><a href=#tabular-data><span class=secno>4.9 </span>Tabular data</a>
1041     <ol>
1042      <li><a href=#the-table-element><span class=secno>4.9.1 </span>The <code>table</code> element</a>
1043       <ol>
1044        <li><a href=#table-descriptions-techniques><span class=secno>4.9.1.1 </span>Techniques for describing tables</a></li>
1045        <li><a href=#table-layout-techniques><span class=secno>4.9.1.2 </span>Techniques for table design</a></ol></li>
1046      <li><a href=#the-caption-element><span class=secno>4.9.2 </span>The <code>caption</code> element</a></li>
1047      <li><a href=#the-colgroup-element><span class=secno>4.9.3 </span>The <code>colgroup</code> element</a></li>
1048      <li><a href=#the-col-element><span class=secno>4.9.4 </span>The <code>col</code> element</a></li>
1049      <li><a href=#the-tbody-element><span class=secno>4.9.5 </span>The <code>tbody</code> element</a></li>
1050      <li><a href=#the-thead-element><span class=secno>4.9.6 </span>The <code>thead</code> element</a></li>
1051      <li><a href=#the-tfoot-element><span class=secno>4.9.7 </span>The <code>tfoot</code> element</a></li>
1052      <li><a href=#the-tr-element><span class=secno>4.9.8 </span>The <code>tr</code> element</a></li>
1053      <li><a href=#the-td-element><span class=secno>4.9.9 </span>The <code>td</code> element</a></li>
1054      <li><a href=#the-th-element><span class=secno>4.9.10 </span>The <code>th</code> element</a></li>
1055      <li><a href=#attributes-common-to-td-and-th-elements><span class=secno>4.9.11 </span>Attributes common to <code>td</code> and <code>th</code> elements</a></li>
1056      <li><a href=#processing-model-1><span class=secno>4.9.12 </span>Processing model</a>
1057       <ol>
1058        <li><a href=#forming-a-table><span class=secno>4.9.12.1 </span>Forming a table</a></li>
1059        <li><a href=#header-and-data-cell-semantics><span class=secno>4.9.12.2 </span>Forming relationships between data cells and header cells</a></ol></li>
1060      <li><a href=#table-sorting-model><span class=secno>4.9.13 </span>Table sorting model</a></li>
1061      <li><a href=#examples><span class=secno>4.9.14 </span>Examples</a></ol></li>
1062    <li><a href=#forms><span class=secno>4.10 </span>Forms</a>
1063     <ol>
1064      <li><a href=#introduction-2><span class=secno>4.10.1 </span>Introduction</a>
1065       <ol>
1066        <li><a href="#writing-a-form's-user-interface"><span class=secno>4.10.1.1 </span>Writing a form's user interface</a></li>
1067        <li><a href=#implementing-the-server-side-processing-for-a-form><span class=secno>4.10.1.2 </span>Implementing the server-side processing for a form</a></li>
1068        <li><a href=#configuring-a-form-to-communicate-with-a-server><span class=secno>4.10.1.3 </span>Configuring a form to communicate with a server</a></li>
1069        <li><a href=#client-side-form-validation><span class=secno>4.10.1.4 </span>Client-side form validation</a></li>
1070        <li><a href=#enabling-client-side-automatic-filling-of-form-controls><span class=secno>4.10.1.5 </span>Enabling client-side automatic filling of form controls</a></li>
1071        <li><a href=#improving-the-user-experience-on-mobile-devices><span class=secno>4.10.1.6 </span>Improving the user experience on mobile devices</a></li>
1072        <li><a href=#the-difference-between-the-field-type,-the-autofill-field-name,-and-the-input-modality><span class=secno>4.10.1.7 </span>The difference between the field type, the autofill field name, and the input modality</a></li>
1073        <li><a href=#input-author-notes><span class=secno>4.10.1.8 </span>Date, time, and number formats</a></ol></li>
1074      <li><a href=#categories><span class=secno>4.10.2 </span>Categories</a></li>
1075      <li><a href=#the-form-element><span class=secno>4.10.3 </span>The <code>form</code> element</a></li>
1076      <li><a href=#the-label-element><span class=secno>4.10.4 </span>The <code>label</code> element</a></li>
1077      <li><a href=#the-input-element><span class=secno>4.10.5 </span>The <code>input</code> element</a>
1078       <ol>
1079        <li><a href=#states-of-the-type-attribute><span class=secno>4.10.5.1 </span>States of the <code title=attr-input-type>type</code> attribute</a>
1080         <ol>
1081          <li><a href="#hidden-state-(type=hidden)"><span class=secno>4.10.5.1.1 </span>Hidden state (<code title="">type=hidden</code>)</a></li>
1082          <li><a href="#text-(type=text)-state-and-search-state-(type=search)"><span class=secno>4.10.5.1.2 </span>Text (<code title="">type=text</code>) state and Search state (<code title="">type=search</code>)</a></li>
1083          <li><a href="#telephone-state-(type=tel)"><span class=secno>4.10.5.1.3 </span>Telephone state (<code title="">type=tel</code>)</a></li>
1084          <li><a href="#url-state-(type=url)"><span class=secno>4.10.5.1.4 </span>URL state (<code title="">type=url</code>)</a></li>
1085          <li><a href="#e-mail-state-(type=email)"><span class=secno>4.10.5.1.5 </span>E-mail state (<code title="">type=email</code>)</a></li>
1086          <li><a href="#password-state-(type=password)"><span class=secno>4.10.5.1.6 </span>Password state (<code title="">type=password</code>)</a></li>
1087          <li><a href="#date-and-time-state-(type=datetime)"><span class=secno>4.10.5.1.7 </span>Date and Time state (<code title="">type=datetime</code>)</a></li>
1088          <li><a href="#date-state-(type=date)"><span class=secno>4.10.5.1.8 </span>Date state (<code title="">type=date</code>)</a></li>
1089          <li><a href="#month-state-(type=month)"><span class=secno>4.10.5.1.9 </span>Month state (<code title="">type=month</code>)</a></li>
1090          <li><a href="#week-state-(type=week)"><span class=secno>4.10.5.1.10 </span>Week state (<code title="">type=week</code>)</a></li>
1091          <li><a href="#time-state-(type=time)"><span class=secno>4.10.5.1.11 </span>Time state (<code title="">type=time</code>)</a></li>
1092          <li><a href="#local-date-and-time-state-(type=datetime-local)"><span class=secno>4.10.5.1.12 </span>Local Date and Time state (<code title="">type=datetime-local</code>)</a></li>
1093          <li><a href="#number-state-(type=number)"><span class=secno>4.10.5.1.13 </span>Number state (<code title="">type=number</code>)</a></li>
1094          <li><a href="#range-state-(type=range)"><span class=secno>4.10.5.1.14 </span>Range state (<code title="">type=range</code>)</a></li>
1095          <li><a href="#color-state-(type=color)"><span class=secno>4.10.5.1.15 </span>Color state (<code title="">type=color</code>)</a></li>
1096          <li><a href="#checkbox-state-(type=checkbox)"><span class=secno>4.10.5.1.16 </span>Checkbox state (<code title="">type=checkbox</code>)</a></li>
1097          <li><a href="#radio-button-state-(type=radio)"><span class=secno>4.10.5.1.17 </span>Radio Button state (<code title="">type=radio</code>)</a></li>
1098          <li><a href="#file-upload-state-(type=file)"><span class=secno>4.10.5.1.18 </span>File Upload state (<code title="">type=file</code>)</a></li>
1099          <li><a href="#submit-button-state-(type=submit)"><span class=secno>4.10.5.1.19 </span>Submit Button state (<code title="">type=submit</code>)</a></li>
1100          <li><a href="#image-button-state-(type=image)"><span class=secno>4.10.5.1.20 </span>Image Button state (<code title="">type=image</code>)</a></li>
1101          <li><a href="#reset-button-state-(type=reset)"><span class=secno>4.10.5.1.21 </span>Reset Button state (<code title="">type=reset</code>)</a></li>
1102          <li><a href="#button-state-(type=button)"><span class=secno>4.10.5.1.22 </span>Button state (<code title="">type=button</code>)</a></ol></li>
1103        <li><a href=#input-impl-notes><span class=secno>4.10.5.2 </span>Implemention notes regarding localization of form controls</a></li>
1104        <li><a href=#common-input-element-attributes><span class=secno>4.10.5.3 </span>Common <code>input</code> element attributes</a>
1105         <ol>
1106          <li><a href=#the-maxlength-and-minlength-attributes><span class=secno>4.10.5.3.1 </span>The <code title=attr-input-maxlength>maxlength</code> and <code title=attr-input-minlength>minlength</code> attributes</a></li>
1107          <li><a href=#the-size-attribute><span class=secno>4.10.5.3.2 </span>The <code title=attr-input-size>size</code> attribute</a></li>
1108          <li><a href=#the-readonly-attribute><span class=secno>4.10.5.3.3 </span>The <code title=attr-input-readonly>readonly</code> attribute</a></li>
1109          <li><a href=#the-required-attribute><span class=secno>4.10.5.3.4 </span>The <code title=attr-input-required>required</code> attribute</a></li>
1110          <li><a href=#the-multiple-attribute><span class=secno>4.10.5.3.5 </span>The <code title=attr-input-multiple>multiple</code> attribute</a></li>
1111          <li><a href=#the-pattern-attribute><span class=secno>4.10.5.3.6 </span>The <code title=attr-input-pattern>pattern</code> attribute</a></li>
1112          <li><a href=#the-min-and-max-attributes><span class=secno>4.10.5.3.7 </span>The <code title=attr-input-min>min</code> and <code title=attr-input-max>max</code> attributes</a></li>
1113          <li><a href=#the-step-attribute><span class=secno>4.10.5.3.8 </span>The <code title=attr-input-step>step</code> attribute</a></li>
1114          <li><a href=#the-list-attribute><span class=secno>4.10.5.3.9 </span>The <code title=attr-input-list>list</code> attribute</a></li>
1115          <li><a href=#the-placeholder-attribute><span class=secno>4.10.5.3.10 </span>The <code title=attr-input-placeholder>placeholder</code> attribute</a></ol></li>
1116        <li><a href=#common-input-element-apis><span class=secno>4.10.5.4 </span>Common <code>input</code> element APIs</a></li>
1117        <li><a href=#common-event-behaviors><span class=secno>4.10.5.5 </span>Common event behaviors</a></ol></li>
1118      <li><a href=#the-button-element><span class=secno>4.10.6 </span>The <code>button</code> element</a></li>
1119      <li><a href=#the-select-element><span class=secno>4.10.7 </span>The <code>select</code> element</a></li>
1120      <li><a href=#the-datalist-element><span class=secno>4.10.8 </span>The <code>datalist</code> element</a></li>
1121      <li><a href=#the-optgroup-element><span class=secno>4.10.9 </span>The <code>optgroup</code> element</a></li>
1122      <li><a href=#the-option-element><span class=secno>4.10.10 </span>The <code>option</code> element</a></li>
1123      <li><a href=#the-textarea-element><span class=secno>4.10.11 </span>The <code>textarea</code> element</a></li>
1124      <li><a href=#the-keygen-element><span class=secno>4.10.12 </span>The <code>keygen</code> element</a></li>
1125      <li><a href=#the-output-element><span class=secno>4.10.13 </span>The <code>output</code> element</a></li>
1126      <li><a href=#the-progress-element><span class=secno>4.10.14 </span>The <code>progress</code> element</a></li>
1127      <li><a href=#the-meter-element><span class=secno>4.10.15 </span>The <code>meter</code> element</a></li>
1128      <li><a href=#the-fieldset-element><span class=secno>4.10.16 </span>The <code>fieldset</code> element</a></li>
1129      <li><a href=#the-legend-element><span class=secno>4.10.17 </span>The <code>legend</code> element</a></li>
1130      <li><a href=#form-control-infrastructure><span class=secno>4.10.18 </span>Form control infrastructure</a>
1131       <ol>
1132        <li><a href="#a-form-control's-value"><span class=secno>4.10.18.1 </span>A form control's value</a></li>
1133        <li><a href=#mutability><span class=secno>4.10.18.2 </span>Mutability</a></li>
1134        <li><a href=#association-of-controls-and-forms><span class=secno>4.10.18.3 </span>Association of controls and forms</a></ol></li>
1135      <li><a href=#attributes-common-to-form-controls><span class=secno>4.10.19 </span>Attributes common to form controls</a>
1136       <ol>
1137        <li><a href=#naming-form-controls:-the-name-attribute><span class=secno>4.10.19.1 </span>Naming form controls: the <code title=attr-fe-name>name</code> attribute</a></li>
1138        <li><a href=#submitting-element-directionality:-the-dirname-attribute><span class=secno>4.10.19.2 </span>Submitting element directionality: the <code title=attr-fe-dirname>dirname</code> attribute</a></li>
1139        <li><a href=#limiting-user-input-length:-the-maxlength-attribute><span class=secno>4.10.19.3 </span>Limiting user input length: the <code title=attr-fe-maxlength>maxlength</code> attribute</a></li>
1140        <li><a href=#setting-minimum-input-length-requirements:-the-minlength-attribute><span class=secno>4.10.19.4 </span>Setting minimum input length requirements: the <code title=attr-fe-minlength>minlength</code> attribute</a></li>
1141        <li><a href=#enabling-and-disabling-form-controls:-the-disabled-attribute><span class=secno>4.10.19.5 </span>Enabling and disabling form controls: the <code title=attr-fe-disabled>disabled</code> attribute</a></li>
1142        <li><a href=#form-submission-0><span class=secno>4.10.19.6 </span>Form submission</a></li>
1143        <li><a href=#autofocusing-a-form-control:-the-autofocus-attribute><span class=secno>4.10.19.7 </span>Autofocusing a form control: the <code title=attr-fe-autofocus>autofocus</code> attribute</a></li>
1144        <li><a href=#input-modalities:-the-inputmode-attribute><span class=secno>4.10.19.8 </span>Input modalities: the <code title=attr-fe-inputmode>inputmode</code> attribute</a></li>
1145        <li><a href=#autofilling-form-controls:-the-autocomplete-attribute><span class=secno>4.10.19.9 </span>Autofilling form controls: the <code title=attr-fe-autocomplete>autocomplete</code> attribute</a></ol></li>
1146      <li><a href=#textFieldSelection><span class=secno>4.10.20 </span>APIs for the text field selections</a></li>
1147      <li><a href=#constraints><span class=secno>4.10.21 </span>Constraints</a>
1148       <ol>
1149        <li><a href=#definitions><span class=secno>4.10.21.1 </span>Definitions</a></li>
1150        <li><a href=#constraint-validation><span class=secno>4.10.21.2 </span>Constraint validation</a></li>
1151        <li><a href=#the-constraint-validation-api><span class=secno>4.10.21.3 </span>The constraint validation API</a></li>
1152        <li><a href=#security-forms><span class=secno>4.10.21.4 </span>Security</a></ol></li>
1153      <li><a href=#form-submission><span class=secno>4.10.22 </span>Form submission</a>
1154       <ol>
1155        <li><a href=#introduction-3><span class=secno>4.10.22.1 </span>Introduction</a></li>
1156        <li><a href=#implicit-submission><span class=secno>4.10.22.2 </span>Implicit submission</a></li>
1157        <li><a href=#form-submission-algorithm><span class=secno>4.10.22.3 </span>Form submission algorithm</a></li>
1158        <li><a href=#constructing-form-data-set><span class=secno>4.10.22.4 </span>Constructing the form data set</a></li>
1159        <li><a href=#selecting-a-form-submission-encoding><span class=secno>4.10.22.5 </span>Selecting a form submission encoding</a></li>
1160        <li><a href=#url-encoded-form-data><span class=secno>4.10.22.6 </span>URL-encoded form data</a></li>
1161        <li><a href=#multipart-form-data><span class=secno>4.10.22.7 </span>Multipart form data</a></li>
1162        <li><a href=#plain-text-form-data><span class=secno>4.10.22.8 </span>Plain text form data</a></ol></li>
1163      <li><a href=#resetting-a-form><span class=secno>4.10.23 </span>Resetting a form</a></ol></li>
1164    <li><a href=#interactive-elements><span class=secno>4.11 </span>Interactive elements</a>
1165     <ol>
1166      <li><a href=#the-details-element><span class=secno>4.11.1 </span>The <code>details</code> element</a></li>
1167      <li><a href=#the-summary-element><span class=secno>4.11.2 </span>The <code>summary</code> element</a></li>
1168      <li><a href=#the-menu-element><span class=secno>4.11.3 </span>The <code>menu</code> element</a></li>
1169      <li><a href=#the-menuitem-element><span class=secno>4.11.4 </span>The <code>menuitem</code> element</a></li>
1170      <li><a href=#context-menus><span class=secno>4.11.5 </span>Context menus</a>
1171       <ol>
1172        <li><a href=#declaring-a-context-menu><span class=secno>4.11.5.1 </span>Declaring a context menu</a></li>
1173        <li><a href=#processing-model-2><span class=secno>4.11.5.2 </span>Processing model</a></li>
1174        <li><a href=#event-definitions-0><span class=secno>4.11.5.3 </span>Event definitions</a></ol></li>
1175      <li><a href=#commands><span class=secno>4.11.6 </span>Commands</a>
1176       <ol>
1177        <li><a href=#facets-0><span class=secno>4.11.6.1 </span>Facets</a></li>
1178        <li><a href=#using-the-a-element-to-define-a-command><span class=secno>4.11.6.2 </span>Using the <code>a</code> element to define a command</a></li>
1179        <li><a href=#using-the-button-element-to-define-a-command><span class=secno>4.11.6.3 </span>Using the <code>button</code> element to define a command</a></li>
1180        <li><a href=#using-the-input-element-to-define-a-command><span class=secno>4.11.6.4 </span>Using the <code>input</code> element to define a command</a></li>
1181        <li><a href=#using-the-option-element-to-define-a-command><span class=secno>4.11.6.5 </span>Using the <code>option</code> element to define a command</a></li>
1182        <li><a href=#using-the-menuitem-element-to-define-a-command><span class=secno>4.11.6.6 </span>Using the <code>menuitem</code> element to define a
1183   command</a></li>
1184        <li><a href=#using-the-command-attribute-on-menuitem-elements-to-define-a-command-indirectly><span class=secno>4.11.6.7 </span>Using the <code title=attr-menuitem-command>command</code> attribute on <code>menuitem</code> elements to define
1185   a command indirectly</a></li>
1186        <li><a href=#using-the-accesskey-attribute-on-a-label-element-to-define-a-command><span class=secno>4.11.6.8 </span>Using the <code title=attr-accesskey>accesskey</code> attribute
1187   on a <code>label</code> element to define a command</a></li>
1188        <li><a href=#using-the-accesskey-attribute-on-a-legend-element-to-define-a-command><span class=secno>4.11.6.9 </span>Using the <code title=attr-accesskey>accesskey</code> attribute
1189   on a <code>legend</code> element to define a command</a></li>
1190        <li><a href=#using-the-accesskey-attribute-to-define-a-command-on-other-elements><span class=secno>4.11.6.10 </span>Using the <code title=attr-accesskey>accesskey</code>
1191   attribute to define a command on other elements</a></ol></li>
1192      <li><a href=#the-dialog-element><span class=secno>4.11.7 </span>The <code>dialog</code> element</a>
1193       <ol>
1194        <li><a href=#anchor-points><span class=secno>4.11.7.1 </span>Anchor points</a></ol></ol></li>
1195    <li><a href=#scripting-1><span class=secno>4.12 </span>Scripting</a>
1196     <ol>
1197      <li><a href=#the-script-element><span class=secno>4.12.1 </span>The <code>script</code> element</a>
1198       <ol>
1199        <li><a href=#scriptingLanguages><span class=secno>4.12.1.1 </span>Scripting languages</a></li>
1200        <li><a href=#restrictions-for-contents-of-script-elements><span class=secno>4.12.1.2 </span>Restrictions for contents of <code>script</code> elements</a></li>
1201        <li><a href=#inline-documentation-for-external-scripts><span class=secno>4.12.1.3 </span>Inline documentation for external scripts</a></li>
1202        <li><a href=#scriptTagXSLT><span class=secno>4.12.1.4 </span>Interaction of <code>script</code> elements and XSLT</a></ol></li>
1203      <li><a href=#the-noscript-element><span class=secno>4.12.2 </span>The <code>noscript</code> element</a></li>
1204      <li><a href=#the-template-element><span class=secno>4.12.3 </span>The <code>template</code> element</a>
1205       <ol>
1206        <li><a href=#template-XSLT-XPath><span class=secno>4.12.3.1 </span>Interaction of <code>template</code> elements with XSLT and XPath</a></ol></li>
1207      <li><a href=#the-canvas-element><span class=secno>4.12.4 </span>The <code>canvas</code> element</a>
1208       <ol>
1209        <li><a href=#proxying-canvases-to-workers><span class=secno>4.12.4.1 </span>Proxying canvases to workers</a></li>
1210        <li><a href=#2dcontext><span class=secno>4.12.4.2 </span>The 2D rendering context</a>
1211         <ol>
1212          <li><a href=#implementation-notes><span class=secno>4.12.4.2.1 </span>Implementation notes</a></li>
1213          <li><a href=#the-canvas-state><span class=secno>4.12.4.2.2 </span>The canvas state</a></li>
1214          <li><a href=#drawingstyle-objects><span class=secno>4.12.4.2.3 </span><code>DrawingStyle</code> objects</a></li>
1215          <li><a href=#line-styles><span class=secno>4.12.4.2.4 </span>Line styles</a></li>
1216          <li><a href=#text-styles><span class=secno>4.12.4.2.5 </span>Text styles</a></li>
1217          <li><a href=#building-paths><span class=secno>4.12.4.2.6 </span>Building paths</a></li>
1218          <li><a href=#path-objects><span class=secno>4.12.4.2.7 </span><code>Path</code> objects</a></li>
1219          <li><a href=#transformations><span class=secno>4.12.4.2.8 </span>Transformations</a></li>
1220          <li><a href=#image-sources-for-2d-rendering-contexts><span class=secno>4.12.4.2.9 </span>Image sources for 2D rendering contexts</a></li>
1221          <li><a href=#fill-and-stroke-styles><span class=secno>4.12.4.2.10 </span>Fill and stroke styles</a></li>
1222          <li><a href=#drawing-rectangles-to-the-bitmap><span class=secno>4.12.4.2.11 </span>Drawing rectangles to the bitmap</a></li>
1223          <li><a href=#drawing-text-to-the-bitmap><span class=secno>4.12.4.2.12 </span>Drawing text to the bitmap</a></li>
1224          <li><a href=#drawing-paths-to-the-canvas><span class=secno>4.12.4.2.13 </span>Drawing paths to the canvas</a></li>
1225          <li><a href=#drawing-images><span class=secno>4.12.4.2.14 </span>Drawing images</a></li>
1226          <li><a href=#hit-regions><span class=secno>4.12.4.2.15 </span>Hit regions</a></li>
1227          <li><a href=#pixel-manipulation><span class=secno>4.12.4.2.16 </span>Pixel manipulation</a></li>
1228          <li><a href=#compositing><span class=secno>4.12.4.2.17 </span>Compositing</a></li>
1229          <li><a href=#image-smoothing><span class=secno>4.12.4.2.18 </span>Image smoothing</a></li>
1230          <li><a href=#shadows><span class=secno>4.12.4.2.19 </span>Shadows</a></li>
1231          <li><a href=#drawing-model><span class=secno>4.12.4.2.20 </span>Drawing model</a></li>
1232          <li><a href=#best-practices><span class=secno>4.12.4.2.21 </span>Best practices</a></li>
1233          <li><a href=#examples-0><span class=secno>4.12.4.2.22 </span>Examples</a></ol></li>
1234        <li><a href=#pixel-density><span class=secno>4.12.4.3 </span>Pixel density</a></li>
1235        <li><a href=#color-spaces-and-color-correction><span class=secno>4.12.4.4 </span>Color spaces and color correction</a></li>
1236        <li><a href=#serializing-bitmaps-to-a-file><span class=secno>4.12.4.5 </span>Serializing bitmaps to a file</a></li>
1237        <li><a href=#security-with-canvas-elements><span class=secno>4.12.4.6 </span>Security with <code>canvas</code> elements</a></ol></ol></li>
1238    <li><a href=#common-idioms><span class=secno>4.13 </span>Common idioms without dedicated elements</a>
1239     <ol>
1240      <li><a href=#the-main-part-of-the-content><span class=secno>4.13.1 </span>The main part of the content</a></li>
1241      <li><a href=#rel-up><span class=secno>4.13.2 </span>Bread crumb navigation</a></li>
1242      <li><a href=#tag-clouds><span class=secno>4.13.3 </span>Tag clouds</a></li>
1243      <li><a href=#conversations><span class=secno>4.13.4 </span>Conversations</a></li>
1244      <li><a href=#footnotes><span class=secno>4.13.5 </span>Footnotes</a></ol></li>
1245    <li><a href=#disabled-elements><span class=secno>4.14 </span>Disabled elements</a></li>
1246    <li><a href=#selectors><span class=secno>4.15 </span>Matching HTML elements using selectors</a>
1247     <ol>
1248      <li><a href=#case-sensitivity><span class=secno>4.15.1 </span>Case-sensitivity</a></li>
1249      <li><a href=#pseudo-classes><span class=secno>4.15.2 </span>Pseudo-classes</a></ol></ol></li>
1250  <li><a href=#microdata><span class=secno>5 </span>Microdata</a>
1251   <ol>
1252    <li><a href=#introduction-4><span class=secno>5.1 </span>Introduction</a>
1253     <ol>
1254      <li><a href=#overview><span class=secno>5.1.1 </span>Overview</a></li>
1255      <li><a href=#the-basic-syntax><span class=secno>5.1.2 </span>The basic syntax</a></li>
1256      <li><a href=#typed-items><span class=secno>5.1.3 </span>Typed items</a></li>
1257      <li><a href=#global-identifiers-for-items><span class=secno>5.1.4 </span>Global identifiers for items</a></li>
1258      <li><a href=#selecting-names-when-defining-vocabularies><span class=secno>5.1.5 </span>Selecting names when defining vocabularies</a></li>
1259      <li><a href=#using-the-microdata-dom-api><span class=secno>5.1.6 </span>Using the microdata DOM API</a></ol></li>
1260    <li><a href=#encoding-microdata><span class=secno>5.2 </span>Encoding microdata</a>
1261     <ol>
1262      <li><a href=#the-microdata-model><span class=secno>5.2.1 </span>The microdata model</a></li>
1263      <li><a href=#items><span class=secno>5.2.2 </span>Items</a></li>
1264      <li><a href=#names:-the-itemprop-attribute><span class=secno>5.2.3 </span>Names: the <code>itemprop</code> attribute</a></li>
1265      <li><a href=#values><span class=secno>5.2.4 </span>Values</a></li>
1266      <li><a href=#associating-names-with-items><span class=secno>5.2.5 </span>Associating names with items</a></li>
1267      <li><a href=#microdata-and-other-namespaces><span class=secno>5.2.6 </span>Microdata and other namespaces</a></ol></li>
1268    <li><a href=#microdata-dom-api><span class=secno>5.3 </span>Microdata DOM API</a></li>
1269    <li><a href=#mdvocabs><span class=secno>5.4 </span>Sample microdata vocabularies</a>
1270     <ol>
1271      <li><a href=#vcard><span class=secno>5.4.1 </span>vCard</a>
1272       <ol>
1273        <li><a href=#conversion-to-vcard><span class=secno>5.4.1.1 </span>Conversion to vCard</a></li>
1274        <li><a href=#examples-1><span class=secno>5.4.1.2 </span>Examples</a></ol></li>
1275      <li><a href=#vevent><span class=secno>5.4.2 </span>vEvent</a>
1276       <ol>
1277        <li><a href=#conversion-to-icalendar><span class=secno>5.4.2.1 </span>Conversion to iCalendar</a></li>
1278        <li><a href=#examples-2><span class=secno>5.4.2.2 </span>Examples</a></ol></li>
1279      <li><a href=#licensing-works><span class=secno>5.4.3 </span>Licensing works</a>
1280       <ol>
1281        <li><a href=#examples-3><span class=secno>5.4.3.1 </span>Examples</a></ol></ol></li>
1282    <li><a href=#converting-html-to-other-formats><span class=secno>5.5 </span>Converting HTML to other formats</a>
1283     <ol>
1284      <li><a href=#json><span class=secno>5.5.1 </span>JSON</a></ol></ol></li>
1285  <li><a href=#browsers><span class=secno>6 </span>Loading Web pages</a>
1286   <ol>
1287    <li><a href=#windows><span class=secno>6.1 </span>Browsing contexts</a>
1288     <ol>
1289      <li><a href=#nested-browsing-contexts><span class=secno>6.1.1 </span>Nested browsing contexts</a>
1290       <ol>
1291        <li><a href=#navigating-nested-browsing-contexts-in-the-dom><span class=secno>6.1.1.1 </span>Navigating nested browsing contexts in the DOM</a></ol></li>
1292      <li><a href=#auxiliary-browsing-contexts><span class=secno>6.1.2 </span>Auxiliary browsing contexts</a>
1293       <ol>
1294        <li><a href=#navigating-auxiliary-browsing-contexts-in-the-dom><span class=secno>6.1.2.1 </span>Navigating auxiliary browsing contexts in the DOM</a></ol></li>
1295      <li><a href=#secondary-browsing-contexts><span class=secno>6.1.3 </span>Secondary browsing contexts</a></li>
1296      <li><a href=#security-nav><span class=secno>6.1.4 </span>Security</a></li>
1297      <li><a href=#groupings-of-browsing-contexts><span class=secno>6.1.5 </span>Groupings of browsing contexts</a></li>
1298      <li><a href=#browsing-context-names><span class=secno>6.1.6 </span>Browsing context names</a></ol></li>
1299    <li><a href=#the-window-object><span class=secno>6.2 </span>The <code>Window</code> object</a>
1300     <ol>
1301      <li><a href=#security-window><span class=secno>6.2.1 </span>Security</a></li>
1302      <li><a href=#apis-for-creating-and-navigating-browsing-contexts-by-name><span class=secno>6.2.2 </span>APIs for creating and navigating browsing contexts by name</a></li>
1303      <li><a href=#accessing-other-browsing-contexts><span class=secno>6.2.3 </span>Accessing other browsing contexts</a></li>
1304      <li><a href=#named-access-on-the-window-object><span class=secno>6.2.4 </span>Named access on the <code>Window</code> object</a></li>
1305      <li><a href=#garbage-collection-and-browsing-contexts><span class=secno>6.2.5 </span>Garbage collection and browsing contexts</a></li>
1306      <li><a href=#closing-browsing-contexts><span class=secno>6.2.6 </span>Closing browsing contexts</a></li>
1307      <li><a href=#browser-interface-elements><span class=secno>6.2.7 </span>Browser interface elements</a></li>
1308      <li><a href=#the-windowproxy-object><span class=secno>6.2.8 </span>The <code>WindowProxy</code> object</a></ol></li>
1309    <li><a href=#origin-0><span class=secno>6.3 </span>Origin</a>
1310     <ol>
1311      <li><a href=#relaxing-the-same-origin-restriction><span class=secno>6.3.1 </span>Relaxing the same-origin restriction</a></ol></li>
1312    <li><a href=#sandboxing><span class=secno>6.4 </span>Sandboxing</a></li>
1313    <li><a href=#history><span class=secno>6.5 </span>Session history and navigation</a>
1314     <ol>
1315      <li><a href=#the-session-history-of-browsing-contexts><span class=secno>6.5.1 </span>The session history of browsing contexts</a></li>
1316      <li><a href=#the-history-interface><span class=secno>6.5.2 </span>The <code>History</code> interface</a></li>
1317      <li><a href=#the-location-interface><span class=secno>6.5.3 </span>The <code>Location</code> interface</a>
1318       <ol>
1319        <li><a href=#security-location><span class=secno>6.5.3.1 </span>Security</a></ol></li>
1320      <li><a href=#history-notes><span class=secno>6.5.4 </span>Implementation notes for session history</a></ol></li>
1321    <li><a href=#browsing-the-web><span class=secno>6.6 </span>Browsing the Web</a>
1322     <ol>
1323      <li><a href=#navigating-across-documents><span class=secno>6.6.1 </span>Navigating across documents</a></li>
1324      <li><a href=#read-html><span class=secno>6.6.2 </span>Page load processing model for HTML files</a></li>
1325      <li><a href=#read-xml><span class=secno>6.6.3 </span>Page load processing model for XML files</a></li>
1326      <li><a href=#read-text><span class=secno>6.6.4 </span>Page load processing model for text files</a></li>
1327      <li><a href=#read-multipart-x-mixed-replace><span class=secno>6.6.5 </span>Page load processing model for <code>multipart/x-mixed-replace</code> resources</a></li>
1328      <li><a href=#read-media><span class=secno>6.6.6 </span>Page load processing model for media</a></li>
1329      <li><a href=#read-plugin><span class=secno>6.6.7 </span>Page load processing model for content that uses plugins</a></li>
1330      <li><a href=#read-ua-inline><span class=secno>6.6.8 </span>Page load processing model for inline
1331   content that doesn't have a DOM</a></li>
1332      <li><a href=#scroll-to-fragid><span class=secno>6.6.9 </span>Navigating to a fragment identifier</a></li>
1333      <li><a href=#history-traversal><span class=secno>6.6.10 </span>History traversal</a>
1334       <ol>
1335        <li><a href=#event-definitions-1><span class=secno>6.6.10.1 </span>Event definitions</a></ol></li>
1336      <li><a href=#unloading-documents><span class=secno>6.6.11 </span>Unloading documents</a>
1337       <ol>
1338        <li><a href=#event-definition><span class=secno>6.6.11.1 </span>Event definition</a></ol></li>
1339      <li><a href=#aborting-a-document-load><span class=secno>6.6.12 </span>Aborting a document load</a></ol></li>
1340    <li><a href=#offline><span class=secno>6.7 </span>Offline Web applications</a>
1341     <ol>
1342      <li><a href=#introduction-5><span class=secno>6.7.1 </span>Introduction</a>
1343       <ol>
1344        <li><a href=#supporting-offline-caching-for-legacy-applications><span class=secno>6.7.1.1 </span>Supporting offline caching for legacy applications</a></li>
1345        <li><a href=#appcacheevents><span class=secno>6.7.1.2 </span>Event summary</a></ol></li>
1346      <li><a href=#appcache><span class=secno>6.7.2 </span>Application caches</a></li>
1347      <li><a href=#manifests><span class=secno>6.7.3 </span>The cache manifest syntax</a>
1348       <ol>
1349        <li><a href=#some-sample-manifests><span class=secno>6.7.3.1 </span>Some sample manifests</a></li>
1350        <li><a href=#writing-cache-manifests><span class=secno>6.7.3.2 </span>Writing cache manifests</a></li>
1351        <li><a href=#parsing-cache-manifests><span class=secno>6.7.3.3 </span>Parsing cache manifests</a></ol></li>
1352      <li><a href=#downloading-or-updating-an-application-cache><span class=secno>6.7.4 </span>Downloading or updating an application cache</a></li>
1353      <li><a href=#the-application-cache-selection-algorithm><span class=secno>6.7.5 </span>The application cache selection algorithm</a></li>
1354      <li><a href=#changesToNetworkingModel><span class=secno>6.7.6 </span>Changes to the networking model</a></li>
1355      <li><a href=#expiring-application-caches><span class=secno>6.7.7 </span>Expiring application caches</a></li>
1356      <li><a href=#disk-space><span class=secno>6.7.8 </span>Disk space</a></li>
1357      <li><a href=#application-cache-api><span class=secno>6.7.9 </span>Application cache API</a></li>
1358      <li><a href=#browser-state><span class=secno>6.7.10 </span>Browser state</a></ol></ol></li>
1359  <li><a href=#webappapis><span class=secno>7 </span>Web application APIs</a>
1360   <ol>
1361    <li><a href=#scripting><span class=secno>7.1 </span>Scripting</a>
1362     <ol>
1363      <li><a href=#introduction-6><span class=secno>7.1.1 </span>Introduction</a></li>
1364      <li><a href=#enabling-and-disabling-scripting><span class=secno>7.1.2 </span>Enabling and disabling scripting</a></li>
1365      <li><a href=#processing-model-3><span class=secno>7.1.3 </span>Processing model</a>
1366       <ol>
1367        <li><a href=#definitions-0><span class=secno>7.1.3.1 </span>Definitions</a></li>
1368        <li><a href=#script-settings-for-browsing-contexts><span class=secno>7.1.3.2 </span>Script settings for browsing contexts</a></li>
1369        <li><a href=#calling-scripts><span class=secno>7.1.3.3 </span>Calling scripts</a></li>
1370        <li><a href=#creating-scripts><span class=secno>7.1.3.4 </span>Creating scripts</a></li>
1371        <li><a href=#killing-scripts><span class=secno>7.1.3.5 </span>Killing scripts</a></li>
1372        <li><a href=#runtime-script-errors><span class=secno>7.1.3.6 </span>Runtime script errors</a>
1373         <ol>
1374          <li><a href=#runtime-script-errors-in-documents><span class=secno>7.1.3.6.1 </span>Runtime script errors in documents</a></li>
1375          <li><a href=#the-errorevent-interface><span class=secno>7.1.3.6.2 </span>The <code>ErrorEvent</code> interface</a></ol></ol></li>
1376      <li><a href=#event-loops><span class=secno>7.1.4 </span>Event loops</a>
1377       <ol>
1378        <li><a href=#definitions-1><span class=secno>7.1.4.1 </span>Definitions</a></li>
1379        <li><a href=#processing-model-4><span class=secno>7.1.4.2 </span>Processing model</a></li>
1380        <li><a href=#generic-task-sources><span class=secno>7.1.4.3 </span>Generic task sources</a></ol></li>
1381      <li><a href=#javascript-protocol><span class=secno>7.1.5 </span>The <code title="">javascript:</code> URL scheme</a></li>
1382      <li><a href=#events><span class=secno>7.1.6 </span>Events</a>
1383       <ol>
1384        <li><a href=#event-handler-attributes><span class=secno>7.1.6.1 </span>Event handlers</a></li>
1385        <li><a href=#event-handlers-on-elements,-document-objects,-and-window-objects><span class=secno>7.1.6.2 </span>Event handlers on elements, <code>Document</code> objects, and <code>Window</code> objects</a>
1386         <ol>
1387          <li><a href=#idl-definitions><span class=secno>7.1.6.2.1 </span>IDL definitions</a></ol></li>
1388        <li><a href=#event-firing><span class=secno>7.1.6.3 </span>Event firing</a></li>
1389        <li><a href=#events-and-the-window-object><span class=secno>7.1.6.4 </span>Events and the <code>Window</code> object</a></ol></ol></li>
1390    <li><a href=#atob><span class=secno>7.2 </span>Base64 utility methods</a></li>
1391    <li><a href=#dynamic-markup-insertion><span class=secno>7.3 </span>Dynamic markup insertion</a>
1392     <ol>
1393      <li><a href=#opening-the-input-stream><span class=secno>7.3.1 </span>Opening the input stream</a></li>
1394      <li><a href=#closing-the-input-stream><span class=secno>7.3.2 </span>Closing the input stream</a></li>
1395      <li><a href=#document.write()><span class=secno>7.3.3 </span><code title=dom-document-write>document.write()</code></a></li>
1396      <li><a href=#document.writeln()><span class=secno>7.3.4 </span><code title=dom-document-writeln>document.writeln()</code></a></ol></li>
1397    <li><a href=#timers><span class=secno>7.4 </span>Timers</a></li>
1398    <li><a href=#user-prompts><span class=secno>7.5 </span>User prompts</a>
1399     <ol>
1400      <li><a href=#simple-dialogs><span class=secno>7.5.1 </span>Simple dialogs</a></li>
1401      <li><a href=#printing><span class=secno>7.5.2 </span>Printing</a></li>
1402      <li><a href=#dialogs-implemented-using-separate-documents><span class=secno>7.5.3 </span>Dialogs implemented using separate documents</a></ol></li>
1403    <li><a href=#system-state-and-capabilities><span class=secno>7.6 </span>System state and capabilities</a>
1404     <ol>
1405      <li><a href=#the-navigator-object><span class=secno>7.6.1 </span>The <code>Navigator</code> object</a>
1406       <ol>
1407        <li><a href=#client-identification><span class=secno>7.6.1.1 </span>Client identification</a></li>
1408        <li><a href=#language-preferences><span class=secno>7.6.1.2 </span>Language preferences</a></li>
1409        <li><a href=#custom-handlers><span class=secno>7.6.1.3 </span>Custom scheme and content handlers</a>
1410         <ol>
1411          <li><a href=#security-and-privacy><span class=secno>7.6.1.3.1 </span>Security and privacy</a></li>
1412          <li><a href=#sample-handler-impl><span class=secno>7.6.1.3.2 </span>Sample user interface</a></ol></li>
1413        <li><a href=#manually-releasing-the-storage-mutex><span class=secno>7.6.1.4 </span>Manually releasing the storage mutex</a></li>
1414        <li><a href=#plugins-0><span class=secno>7.6.1.5 </span>Plugins</a></ol></li>
1415      <li><a href=#the-external-interface><span class=secno>7.6.2 </span>The <code>External</code> interface</a></ol></li>
1416    <li><a href=#images><span class=secno>7.7 </span>Images</a></ol></li>
1417  <li><a href=#editing><span class=secno>8 </span>User interaction</a>
1418   <ol>
1419    <li><a href=#the-hidden-attribute><span class=secno>8.1 </span>The <code>hidden</code> attribute</a></li>
1420    <li><a href=#inert-subtrees><span class=secno>8.2 </span>Inert subtrees</a>
1421     <ol>
1422      <li><a href=#the-inert-attribute><span class=secno>8.2.1 </span>The <code>inert</code> attribute</a></ol></li>
1423    <li><a href=#activation><span class=secno>8.3 </span>Activation</a></li>
1424    <li><a href=#focus><span class=secno>8.4 </span>Focus</a>
1425     <ol>
1426      <li><a href=#sequential-focus-navigation-and-the-tabindex-attribute><span class=secno>8.4.1 </span>Sequential focus navigation and the <code title=attr-tabindex>tabindex</code> attribute</a></li>
1427      <li><a href=#focus-management><span class=secno>8.4.2 </span>Focus management</a></li>
1428      <li><a href=#document-level-focus-apis><span class=secno>8.4.3 </span>Document-level focus APIs</a></li>
1429      <li><a href=#element-level-focus-apis><span class=secno>8.4.4 </span>Element-level focus APIs</a></ol></li>
1430    <li><a href=#assigning-keyboard-shortcuts><span class=secno>8.5 </span>Assigning keyboard shortcuts</a>
1431     <ol>
1432      <li><a href=#introduction-7><span class=secno>8.5.1 </span>Introduction</a></li>
1433      <li><a href=#the-accesskey-attribute><span class=secno>8.5.2 </span>The <code>accesskey</code> attribute</a></li>
1434      <li><a href=#processing-model-5><span class=secno>8.5.3 </span>Processing model</a></ol></li>
1435    <li><a href=#editing-0><span class=secno>8.6 </span>Editing</a>
1436     <ol>
1437      <li><a href=#contenteditable><span class=secno>8.6.1 </span>Making document regions editable: The <code title=attr-contenteditable>contenteditable</code> content attribute</a></li>
1438      <li><a href=#making-entire-documents-editable:-the-designmode-idl-attribute><span class=secno>8.6.2 </span>Making entire documents editable: The <code title=dom-document-designMode>designMode</code> IDL attribute</a></li>
1439      <li><a href=#best-practices-for-in-page-editors><span class=secno>8.6.3 </span>Best practices for in-page editors</a></li>
1440      <li><a href=#editing-apis><span class=secno>8.6.4 </span>Editing APIs</a></li>
1441      <li><a href=#spelling-and-grammar-checking><span class=secno>8.6.5 </span>Spelling and grammar checking</a></ol></li>
1442    <li><a href=#dnd><span class=secno>8.7 </span>Drag and drop</a>
1443     <ol>
1444      <li><a href=#introduction-8><span class=secno>8.7.1 </span>Introduction</a></li>
1445      <li><a href=#the-drag-data-store><span class=secno>8.7.2 </span>The drag data store</a></li>
1446      <li><a href=#the-datatransfer-interface><span class=secno>8.7.3 </span>The <code>DataTransfer</code> interface</a>
1447       <ol>
1448        <li><a href=#the-datatransferitemlist-interface><span class=secno>8.7.3.1 </span>The <code>DataTransferItemList</code> interface</a></li>
1449        <li><a href=#the-datatransferitem-interface><span class=secno>8.7.3.2 </span>The <code>DataTransferItem</code> interface</a></ol></li>
1450      <li><a href=#the-dragevent-interface><span class=secno>8.7.4 </span>The <code>DragEvent</code> interface</a></li>
1451      <li><a href=#drag-and-drop-processing-model><span class=secno>8.7.5 </span>Drag-and-drop processing model</a></li>
1452      <li><a href=#dndevents><span class=secno>8.7.6 </span>Events summary</a></li>
1453      <li><a href=#the-draggable-attribute><span class=secno>8.7.7 </span>The <code>draggable</code> attribute</a></li>
1454      <li><a href=#the-dropzone-attribute><span class=secno>8.7.8 </span>The <code>dropzone</code> attribute</a></li>
1455      <li><a href=#security-risks-in-the-drag-and-drop-model><span class=secno>8.7.9 </span>Security risks in the drag-and-drop model</a></ol></ol></li>
1456  <li><a href=#comms><span class=secno>9 </span>Communication</a>
1457   <ol>
1458    <li><a href=#event-definitions-2><span class=secno>9.1 </span>Event definitions</a></li>
1459    <li><a href=#server-sent-events><span class=secno>9.2 </span>Server-sent events</a>
1460     <ol>
1461      <li><a href=#server-sent-events-intro><span class=secno>9.2.1 </span>Introduction</a></li>
1462      <li><a href=#the-eventsource-interface><span class=secno>9.2.2 </span>The <code>EventSource</code> interface</a></li>
1463      <li><a href=#processing-model-6><span class=secno>9.2.3 </span>Processing model</a></li>
1464      <li><a href=#parsing-an-event-stream><span class=secno>9.2.4 </span>Parsing an event stream</a></li>
1465      <li><a href=#event-stream-interpretation><span class=secno>9.2.5 </span>Interpreting an event stream</a></li>
1466      <li><a href=#authoring-notes><span class=secno>9.2.6 </span>Authoring notes</a></li>
1467      <li><a href=#eventsource-push><span class=secno>9.2.7 </span>Connectionless push and other features</a></li>
1468      <li><a href=#garbage-collection-0><span class=secno>9.2.8 </span>Garbage collection</a></li>
1469      <li><a href=#implementation-advice><span class=secno>9.2.9 </span>Implementation advice</a></li>
1470      <li><a href=#iana-considerations><span class=secno>9.2.10 </span>IANA considerations</a>
1471       <ol>
1472        <li><a href=#text/event-stream><span class=secno>9.2.10.1 </span><code>text/event-stream</code></a></li>
1473        <li><a href=#last-event-id><span class=secno>9.2.10.2 </span><code>Last-Event-ID</code></a></ol></ol></li>
1474    <li><a href=#network><span class=secno>9.3 </span>Web sockets</a>
1475     <ol>
1476      <li><a href=#network-intro><span class=secno>9.3.1 </span>Introduction</a></li>
1477      <li><a href=#the-websocket-interface><span class=secno>9.3.2 </span>The <code>WebSocket</code> interface</a></li>
1478      <li><a href=#feedback-from-the-protocol><span class=secno>9.3.3 </span>Feedback from the protocol</a></li>
1479      <li><a href=#ping-and-pong-frames><span class=secno>9.3.4 </span>Ping and Pong frames</a></li>
1480      <li><a href=#parsing-websocket-urls><span class=secno>9.3.5 </span>Parsing WebSocket URLs</a></li>
1481      <li><a href=#event-definitions-3><span class=secno>9.3.6 </span>Event definitions</a></li>
1482      <li><a href=#garbage-collection-1><span class=secno>9.3.7 </span>Garbage collection</a></ol></li>
1483    <li><a href=#web-messaging><span class=secno>9.4 </span>Cross-document messaging</a>
1484     <ol>
1485      <li><a href=#introduction-9><span class=secno>9.4.1 </span>Introduction</a></li>
1486      <li><a href=#security-postmsg><span class=secno>9.4.2 </span>Security</a>
1487       <ol>
1488        <li><a href=#authors><span class=secno>9.4.2.1 </span>Authors</a></li>
1489        <li><a href=#user-agents><span class=secno>9.4.2.2 </span>User agents</a></ol></li>
1490      <li><a href=#posting-messages><span class=secno>9.4.3 </span>Posting messages</a></ol></li>
1491    <li><a href=#channel-messaging><span class=secno>9.5 </span>Channel messaging</a>
1492     <ol>
1493      <li><a href=#introduction-10><span class=secno>9.5.1 </span>Introduction</a>
1494       <ol>
1495        <li><a href=#examples-4><span class=secno>9.5.1.1 </span>Examples</a></li>
1496        <li><a href=#ports-as-the-basis-of-an-object-capability-model-on-the-web><span class=secno>9.5.1.2 </span>Ports as the basis of an object-capability model on the Web</a></li>
1497        <li><a href=#ports-as-the-basis-of-abstracting-out-service-implementations><span class=secno>9.5.1.3 </span>Ports as the basis of abstracting out service implementations</a></ol></li>
1498      <li><a href=#message-channels><span class=secno>9.5.2 </span>Message channels</a></li>
1499      <li><a href=#message-ports><span class=secno>9.5.3 </span>Message ports</a></li>
1500      <li><a href=#broadcasting-to-many-ports><span class=secno>9.5.4 </span>Broadcasting to many ports</a></li>
1501      <li><a href=#ports-and-garbage-collection><span class=secno>9.5.5 </span>Ports and garbage collection</a></ol></ol></li>
1502  <li><a href=#workers><span class=secno>10 </span>Web workers</a>
1503   <ol>
1504    <li><a href=#introduction-11><span class=secno>10.1 </span>Introduction</a>
1505     <ol>
1506      <li><a href=#scope-0><span class=secno>10.1.1 </span>Scope</a></li>
1507      <li><a href=#examples-5><span class=secno>10.1.2 </span>Examples</a>
1508       <ol>
1509        <li><a href=#a-background-number-crunching-worker><span class=secno>10.1.2.1 </span>A background number-crunching worker</a></li>
1510        <li><a href=#worker-used-for-background-i/o><span class=secno>10.1.2.2 </span>Worker used for background I/O</a></li>
1511        <li><a href=#shared-workers-introduction><span class=secno>10.1.2.3 </span>Shared workers introduction</a></li>
1512        <li><a href=#shared-state-using-a-shared-worker><span class=secno>10.1.2.4 </span>Shared state using a shared worker</a></li>
1513        <li><a href=#delegation><span class=secno>10.1.2.5 </span>Delegation</a></ol></li>
1514      <li><a href=#tutorials><span class=secno>10.1.3 </span>Tutorials</a>
1515       <ol>
1516        <li><a href=#creating-a-dedicated-worker><span class=secno>10.1.3.1 </span>Creating a dedicated worker</a></li>
1517        <li><a href=#communicating-with-a-dedicated-worker><span class=secno>10.1.3.2 </span>Communicating with a dedicated worker</a></li>
1518        <li><a href=#shared-workers><span class=secno>10.1.3.3 </span>Shared workers</a></ol></ol></li>
1519    <li><a href=#infrastructure-0><span class=secno>10.2 </span>Infrastructure</a>
1520     <ol>
1521      <li><a href=#the-global-scope><span class=secno>10.2.1 </span>The global scope</a>
1522       <ol>
1523        <li><a href=#the-workerglobalscope-common-interface><span class=secno>10.2.1.1 </span>The <code>WorkerGlobalScope</code> common interface</a></li>
1524        <li><a href=#dedicated-workers-and-the-dedicatedworkerglobalscope-interface><span class=secno>10.2.1.2 </span>Dedicated workers and the <code>DedicatedWorkerGlobalScope</code> interface</a></li>
1525        <li><a href=#shared-workers-and-the-sharedworkerglobalscope-interface><span class=secno>10.2.1.3 </span>Shared workers and the <code>SharedWorkerGlobalScope</code> interface</a></ol></li>
1526      <li><a href=#the-event-loop><span class=secno>10.2.2 </span>The event loop</a></li>
1527      <li><a href="#the-worker's-lifetime"><span class=secno>10.2.3 </span>The worker's lifetime</a></li>
1528      <li><a href=#processing-model-7><span class=secno>10.2.4 </span>Processing model</a></li>
1529      <li><a href=#runtime-script-errors-0><span class=secno>10.2.5 </span>Runtime script errors</a></li>
1530      <li><a href=#creating-workers><span class=secno>10.2.6 </span>Creating workers</a>
1531       <ol>
1532        <li><a href=#the-abstractworker-abstract-interface><span class=secno>10.2.6.1 </span>The <code>AbstractWorker</code> abstract interface</a></li>
1533        <li><a href=#script-settings-for-workers><span class=secno>10.2.6.2 </span>Script settings for workers</a></li>
1534        <li><a href=#dedicated-workers-and-the-worker-interface><span class=secno>10.2.6.3 </span>Dedicated workers and the <code>Worker</code> interface</a></li>
1535        <li><a href=#shared-workers-and-the-sharedworker-interface><span class=secno>10.2.6.4 </span>Shared workers and the <code>SharedWorker</code> interface</a></ol></ol></li>
1536    <li><a href=#apis-available-to-workers><span class=secno>10.3 </span>APIs available to workers</a>
1537     <ol>
1538      <li><a href=#importing-scripts-and-libraries><span class=secno>10.3.1 </span>Importing scripts and libraries</a></li>
1539      <li><a href=#the-workernavigator-object><span class=secno>10.3.2 </span>The <code>WorkerNavigator</code> object</a></li>
1540      <li><a href=#interface-objects-and-constructors><span class=secno>10.3.3 </span>Interface objects and constructors</a></li>
1541      <li><a href=#worker-locations><span class=secno>10.3.4 </span>Worker locations</a></ol></ol></li>
1542  <li><a href=#webstorage><span class=secno>11 </span>Web storage</a>
1543   <ol>
1544    <li><a href=#introduction-12><span class=secno>11.1 </span>Introduction</a></li>
1545    <li><a href=#storage><span class=secno>11.2 </span>The API</a>
1546     <ol>
1547      <li><a href=#the-storage-interface><span class=secno>11.2.1 </span>The <code>Storage</code> interface</a></li>
1548      <li><a href=#the-sessionstorage-attribute><span class=secno>11.2.2 </span>The <code title=dom-sessionStorage>sessionStorage</code> attribute</a></li>
1549      <li><a href=#the-localstorage-attribute><span class=secno>11.2.3 </span>The <code title=dom-localStorage>localStorage</code> attribute</a></li>
1550      <li><a href=#the-storage-event><span class=secno>11.2.4 </span>The <code title=event-storage>storage</code> event</a>
1551       <ol>
1552        <li><a href=#event-definition-0><span class=secno>11.2.4.1 </span>Event definition</a></ol></li>
1553      <li><a href=#threads><span class=secno>11.2.5 </span>Threads</a></ol></li>
1554    <li><a href=#disk-space-0><span class=secno>11.3 </span>Disk space</a></li>
1555    <li><a href=#privacy><span class=secno>11.4 </span>Privacy</a>
1556     <ol>
1557      <li><a href=#user-tracking><span class=secno>11.4.1 </span>User tracking</a></li>
1558      <li><a href=#sensitivity-of-data><span class=secno>11.4.2 </span>Sensitivity of data</a></ol></li>
1559    <li><a href=#security-storage><span class=secno>11.5 </span>Security</a>
1560     <ol>
1561      <li><a href=#dns-spoofing-attacks><span class=secno>11.5.1 </span>DNS spoofing attacks</a></li>
1562      <li><a href=#cross-directory-attacks><span class=secno>11.5.2 </span>Cross-directory attacks</a></li>
1563      <li><a href=#implementation-risks><span class=secno>11.5.3 </span>Implementation risks</a></ol></ol></li>
1564  <li><a href=#syntax><span class=secno>12 </span>The HTML syntax</a>
1565   <ol>
1566    <li><a href=#writing><span class=secno>12.1 </span>Writing HTML documents</a>
1567     <ol>
1568      <li><a href=#the-doctype><span class=secno>12.1.1 </span>The DOCTYPE</a></li>
1569      <li><a href=#elements-0><span class=secno>12.1.2 </span>Elements</a>
1570       <ol>
1571        <li><a href=#start-tags><span class=secno>12.1.2.1 </span>Start tags</a></li>
1572        <li><a href=#end-tags><span class=secno>12.1.2.2 </span>End tags</a></li>
1573        <li><a href=#attributes-0><span class=secno>12.1.2.3 </span>Attributes</a></li>
1574        <li><a href=#optional-tags><span class=secno>12.1.2.4 </span>Optional tags</a></li>
1575        <li><a href=#element-restrictions><span class=secno>12.1.2.5 </span>Restrictions on content models</a></li>
1576        <li><a href=#cdata-rcdata-restrictions><span class=secno>12.1.2.6 </span>Restrictions on the contents of raw text and escapable raw text elements</a></ol></li>
1577      <li><a href=#text-0><span class=secno>12.1.3 </span>Text</a>
1578       <ol>
1579        <li><a href=#newlines><span class=secno>12.1.3.1 </span>Newlines</a></ol></li>
1580      <li><a href=#character-references><span class=secno>12.1.4 </span>Character references</a></li>
1581      <li><a href=#cdata-sections><span class=secno>12.1.5 </span>CDATA sections</a></li>
1582      <li><a href=#comments><span class=secno>12.1.6 </span>Comments</a></ol></li>
1583    <li><a href=#parsing><span class=secno>12.2 </span>Parsing HTML documents</a>
1584     <ol>
1585      <li><a href=#overview-of-the-parsing-model><span class=secno>12.2.1 </span>Overview of the parsing model</a></li>
1586      <li><a href=#the-input-byte-stream><span class=secno>12.2.2 </span>The input byte stream</a>
1587       <ol>
1588        <li><a href=#parsing-with-a-known-character-encoding><span class=secno>12.2.2.1 </span>Parsing with a known character encoding</a></li>
1589        <li><a href=#determining-the-character-encoding><span class=secno>12.2.2.2 </span>Determining the character encoding</a></li>
1590        <li><a href=#character-encodings><span class=secno>12.2.2.3 </span>Character encodings</a></li>
1591        <li><a href=#changing-the-encoding-while-parsing><span class=secno>12.2.2.4 </span>Changing the encoding while parsing</a></li>
1592        <li><a href=#preprocessing-the-input-stream><span class=secno>12.2.2.5 </span>Preprocessing the input stream</a></ol></li>
1593      <li><a href=#parse-state><span class=secno>12.2.3 </span>Parse state</a>
1594       <ol>
1595        <li><a href=#the-insertion-mode><span class=secno>12.2.3.1 </span>The insertion mode</a></li>
1596        <li><a href=#the-stack-of-open-elements><span class=secno>12.2.3.2 </span>The stack of open elements</a></li>
1597        <li><a href=#the-list-of-active-formatting-elements><span class=secno>12.2.3.3 </span>The list of active formatting elements</a></li>
1598        <li><a href=#the-element-pointers><span class=secno>12.2.3.4 </span>The element pointers</a></li>
1599        <li><a href=#other-parsing-state-flags><span class=secno>12.2.3.5 </span>Other parsing state flags</a></ol></li>
1600      <li><a href=#tokenization><span class=secno>12.2.4 </span>Tokenization</a>
1601       <ol>
1602        <li><a href=#data-state><span class=secno>12.2.4.1 </span>Data state</a></li>
1603        <li><a href=#character-reference-in-data-state><span class=secno>12.2.4.2 </span>Character reference in data state</a></li>
1604        <li><a href=#rcdata-state><span class=secno>12.2.4.3 </span>RCDATA state</a></li>
1605        <li><a href=#character-reference-in-rcdata-state><span class=secno>12.2.4.4 </span>Character reference in RCDATA state</a></li>
1606        <li><a href=#rawtext-state><span class=secno>12.2.4.5 </span>RAWTEXT state</a></li>
1607        <li><a href=#script-data-state><span class=secno>12.2.4.6 </span>Script data state</a></li>
1608        <li><a href=#plaintext-state><span class=secno>12.2.4.7 </span>PLAINTEXT state</a></li>
1609        <li><a href=#tag-open-state><span class=secno>12.2.4.8 </span>Tag open state</a></li>
1610        <li><a href=#end-tag-open-state><span class=secno>12.2.4.9 </span>End tag open state</a></li>
1611        <li><a href=#tag-name-state><span class=secno>12.2.4.10 </span>Tag name state</a></li>
1612        <li><a href=#rcdata-less-than-sign-state><span class=secno>12.2.4.11 </span>RCDATA less-than sign state</a></li>
1613        <li><a href=#rcdata-end-tag-open-state><span class=secno>12.2.4.12 </span>RCDATA end tag open state</a></li>
1614        <li><a href=#rcdata-end-tag-name-state><span class=secno>12.2.4.13 </span>RCDATA end tag name state</a></li>
1615        <li><a href=#rawtext-less-than-sign-state><span class=secno>12.2.4.14 </span>RAWTEXT less-than sign state</a></li>
1616        <li><a href=#rawtext-end-tag-open-state><span class=secno>12.2.4.15 </span>RAWTEXT end tag open state</a></li>
1617        <li><a href=#rawtext-end-tag-name-state><span class=secno>12.2.4.16 </span>RAWTEXT end tag name state</a></li>
1618        <li><a href=#script-data-less-than-sign-state><span class=secno>12.2.4.17 </span>Script data less-than sign state</a></li>
1619        <li><a href=#script-data-end-tag-open-state><span class=secno>12.2.4.18 </span>Script data end tag open state</a></li>
1620        <li><a href=#script-data-end-tag-name-state><span class=secno>12.2.4.19 </span>Script data end tag name state</a></li>
1621        <li><a href=#script-data-escape-start-state><span class=secno>12.2.4.20 </span>Script data escape start state</a></li>
1622        <li><a href=#script-data-escape-start-dash-state><span class=secno>12.2.4.21 </span>Script data escape start dash state</a></li>
1623        <li><a href=#script-data-escaped-state><span class=secno>12.2.4.22 </span>Script data escaped state</a></li>
1624        <li><a href=#script-data-escaped-dash-state><span class=secno>12.2.4.23 </span>Script data escaped dash state</a></li>
1625        <li><a href=#script-data-escaped-dash-dash-state><span class=secno>12.2.4.24 </span>Script data escaped dash dash state</a></li>
1626        <li><a href=#script-data-escaped-less-than-sign-state><span class=secno>12.2.4.25 </span>Script data escaped less-than sign state</a></li>
1627        <li><a href=#script-data-escaped-end-tag-open-state><span class=secno>12.2.4.26 </span>Script data escaped end tag open state</a></li>
1628        <li><a href=#script-data-escaped-end-tag-name-state><span class=secno>12.2.4.27 </span>Script data escaped end tag name state</a></li>
1629        <li><a href=#script-data-double-escape-start-state><span class=secno>12.2.4.28 </span>Script data double escape start state</a></li>
1630        <li><a href=#script-data-double-escaped-state><span class=secno>12.2.4.29 </span>Script data double escaped state</a></li>
1631        <li><a href=#script-data-double-escaped-dash-state><span class=secno>12.2.4.30 </span>Script data double escaped dash state</a></li>
1632        <li><a href=#script-data-double-escaped-dash-dash-state><span class=secno>12.2.4.31 </span>Script data double escaped dash dash state</a></li>
1633        <li><a href=#script-data-double-escaped-less-than-sign-state><span class=secno>12.2.4.32 </span>Script data double escaped less-than sign state</a></li>
1634        <li><a href=#script-data-double-escape-end-state><span class=secno>12.2.4.33 </span>Script data double escape end state</a></li>
1635        <li><a href=#before-attribute-name-state><span class=secno>12.2.4.34 </span>Before attribute name state</a></li>
1636        <li><a href=#attribute-name-state><span class=secno>12.2.4.35 </span>Attribute name state</a></li>
1637        <li><a href=#after-attribute-name-state><span class=secno>12.2.4.36 </span>After attribute name state</a></li>
1638        <li><a href=#before-attribute-value-state><span class=secno>12.2.4.37 </span>Before attribute value state</a></li>
1639        <li><a href=#attribute-value-(double-quoted)-state><span class=secno>12.2.4.38 </span>Attribute value (double-quoted) state</a></li>
1640        <li><a href=#attribute-value-(single-quoted)-state><span class=secno>12.2.4.39 </span>Attribute value (single-quoted) state</a></li>
1641        <li><a href=#attribute-value-(unquoted)-state><span class=secno>12.2.4.40 </span>Attribute value (unquoted) state</a></li>
1642        <li><a href=#character-reference-in-attribute-value-state><span class=secno>12.2.4.41 </span>Character reference in attribute value state</a></li>
1643        <li><a href=#after-attribute-value-(quoted)-state><span class=secno>12.2.4.42 </span>After attribute value (quoted) state</a></li>
1644        <li><a href=#self-closing-start-tag-state><span class=secno>12.2.4.43 </span>Self-closing start tag state</a></li>
1645        <li><a href=#bogus-comment-state><span class=secno>12.2.4.44 </span>Bogus comment state</a></li>
1646        <li><a href=#markup-declaration-open-state><span class=secno>12.2.4.45 </span>Markup declaration open state</a></li>
1647        <li><a href=#comment-start-state><span class=secno>12.2.4.46 </span>Comment start state</a></li>
1648        <li><a href=#comment-start-dash-state><span class=secno>12.2.4.47 </span>Comment start dash state</a></li>
1649        <li><a href=#comment-state><span class=secno>12.2.4.48 </span>Comment state</a></li>
1650        <li><a href=#comment-end-dash-state><span class=secno>12.2.4.49 </span>Comment end dash state</a></li>
1651        <li><a href=#comment-end-state><span class=secno>12.2.4.50 </span>Comment end state</a></li>
1652        <li><a href=#comment-end-bang-state><span class=secno>12.2.4.51 </span>Comment end bang state</a></li>
1653        <li><a href=#doctype-state><span class=secno>12.2.4.52 </span>DOCTYPE state</a></li>
1654        <li><a href=#before-doctype-name-state><span class=secno>12.2.4.53 </span>Before DOCTYPE name state</a></li>
1655        <li><a href=#doctype-name-state><span class=secno>12.2.4.54 </span>DOCTYPE name state</a></li>
1656        <li><a href=#after-doctype-name-state><span class=secno>12.2.4.55 </span>After DOCTYPE name state</a></li>
1657        <li><a href=#after-doctype-public-keyword-state><span class=secno>12.2.4.56 </span>After DOCTYPE public keyword state</a></li>
1658        <li><a href=#before-doctype-public-identifier-state><span class=secno>12.2.4.57 </span>Before DOCTYPE public identifier state</a></li>
1659        <li><a href=#doctype-public-identifier-(double-quoted)-state><span class=secno>12.2.4.58 </span>DOCTYPE public identifier (double-quoted) state</a></li>
1660        <li><a href=#doctype-public-identifier-(single-quoted)-state><span class=secno>12.2.4.59 </span>DOCTYPE public identifier (single-quoted) state</a></li>
1661        <li><a href=#after-doctype-public-identifier-state><span class=secno>12.2.4.60 </span>After DOCTYPE public identifier state</a></li>
1662        <li><a href=#between-doctype-public-and-system-identifiers-state><span class=secno>12.2.4.61 </span>Between DOCTYPE public and system identifiers state</a></li>
1663        <li><a href=#after-doctype-system-keyword-state><span class=secno>12.2.4.62 </span>After DOCTYPE system keyword state</a></li>
1664        <li><a href=#before-doctype-system-identifier-state><span class=secno>12.2.4.63 </span>Before DOCTYPE system identifier state</a></li>
1665        <li><a href=#doctype-system-identifier-(double-quoted)-state><span class=secno>12.2.4.64 </span>DOCTYPE system identifier (double-quoted) state</a></li>
1666        <li><a href=#doctype-system-identifier-(single-quoted)-state><span class=secno>12.2.4.65 </span>DOCTYPE system identifier (single-quoted) state</a></li>
1667        <li><a href=#after-doctype-system-identifier-state><span class=secno>12.2.4.66 </span>After DOCTYPE system identifier state</a></li>
1668        <li><a href=#bogus-doctype-state><span class=secno>12.2.4.67 </span>Bogus DOCTYPE state</a></li>
1669        <li><a href=#cdata-section-state><span class=secno>12.2.4.68 </span>CDATA section state</a></li>
1670        <li><a href=#tokenizing-character-references><span class=secno>12.2.4.69 </span>Tokenizing character references</a></ol></li>
1671      <li><a href=#tree-construction><span class=secno>12.2.5 </span>Tree construction</a>
1672       <ol>
1673        <li><a href=#creating-and-inserting-nodes><span class=secno>12.2.5.1 </span>Creating and inserting nodes</a></li>
1674        <li><a href=#parsing-elements-that-contain-only-text><span class=secno>12.2.5.2 </span>Parsing elements that contain only text</a></li>
1675        <li><a href=#closing-elements-that-have-implied-end-tags><span class=secno>12.2.5.3 </span>Closing elements that have implied end tags</a></li>
1676        <li><a href=#parsing-main-inhtml><span class=secno>12.2.5.4 </span>The rules for parsing tokens in HTML content</a>
1677         <ol>
1678          <li><a href=#the-initial-insertion-mode><span class=secno>12.2.5.4.1 </span>The "initial" insertion mode</a></li>
1679          <li><a href=#the-before-html-insertion-mode><span class=secno>12.2.5.4.2 </span>The "before html" insertion mode</a></li>
1680          <li><a href=#the-before-head-insertion-mode><span class=secno>12.2.5.4.3 </span>The "before head" insertion mode</a></li>
1681          <li><a href=#parsing-main-inhead><span class=secno>12.2.5.4.4 </span>The "in head" insertion mode</a></li>
1682          <li><a href=#parsing-main-inheadnoscript><span class=secno>12.2.5.4.5 </span>The "in head noscript" insertion mode</a></li>
1683          <li><a href=#the-after-head-insertion-mode><span class=secno>12.2.5.4.6 </span>The "after head" insertion mode</a></li>
1684          <li><a href=#parsing-main-inbody><span class=secno>12.2.5.4.7 </span>The "in body" insertion mode</a></li>
1685          <li><a href=#parsing-main-incdata><span class=secno>12.2.5.4.8 </span>The "text" insertion mode</a></li>
1686          <li><a href=#parsing-main-intable><span class=secno>12.2.5.4.9 </span>The "in table" insertion mode</a></li>
1687          <li><a href=#parsing-main-intabletext><span class=secno>12.2.5.4.10 </span>The "in table text" insertion mode</a></li>
1688          <li><a href=#parsing-main-incaption><span class=secno>12.2.5.4.11 </span>The "in caption" insertion mode</a></li>
1689          <li><a href=#parsing-main-incolgroup><span class=secno>12.2.5.4.12 </span>The "in column group" insertion mode</a></li>
1690          <li><a href=#parsing-main-intbody><span class=secno>12.2.5.4.13 </span>The "in table body" insertion mode</a></li>
1691          <li><a href=#parsing-main-intr><span class=secno>12.2.5.4.14 </span>The "in row" insertion mode</a></li>
1692          <li><a href=#parsing-main-intd><span class=secno>12.2.5.4.15 </span>The "in cell" insertion mode</a></li>
1693          <li><a href=#parsing-main-inselect><span class=secno>12.2.5.4.16 </span>The "in select" insertion mode</a></li>
1694          <li><a href=#parsing-main-inselectintable><span class=secno>12.2.5.4.17 </span>The "in select in table" insertion mode</a></li>
1695          <li><a href=#parsing-main-intemplate><span class=secno>12.2.5.4.18 </span>The "in template" insertion mode</a></li>
1696          <li><a href=#parsing-main-afterbody><span class=secno>12.2.5.4.19 </span>The "after body" insertion mode</a></li>
1697          <li><a href=#parsing-main-inframeset><span class=secno>12.2.5.4.20 </span>The "in frameset" insertion mode</a></li>
1698          <li><a href=#parsing-main-afterframeset><span class=secno>12.2.5.4.21 </span>The "after frameset" insertion mode</a></li>
1699          <li><a href=#the-after-after-body-insertion-mode><span class=secno>12.2.5.4.22 </span>The "after after body" insertion mode</a></li>
1700          <li><a href=#the-after-after-frameset-insertion-mode><span class=secno>12.2.5.4.23 </span>The "after after frameset" insertion mode</a></ol></li>
1701        <li><a href=#parsing-main-inforeign><span class=secno>12.2.5.5 </span>The rules for parsing tokens in foreign content</a></ol></li>
1702      <li><a href=#the-end><span class=secno>12.2.6 </span>The end</a></li>
1703      <li><a href=#coercing-an-html-dom-into-an-infoset><span class=secno>12.2.7 </span>Coercing an HTML DOM into an infoset</a></li>
1704      <li><a href=#an-introduction-to-error-handling-and-strange-cases-in-the-parser><span class=secno>12.2.8 </span>An introduction to error handling and strange cases in the parser</a>
1705       <ol>
1706        <li><a href=#misnested-tags:-b-i-/b-/i><span class=secno>12.2.8.1 </span>Misnested tags: &lt;b&gt;&lt;i&gt;&lt;/b&gt;&lt;/i&gt;</a></li>
1707        <li><a href=#misnested-tags:-b-p-/b-/p><span class=secno>12.2.8.2 </span>Misnested tags: &lt;b&gt;&lt;p&gt;&lt;/b&gt;&lt;/p&gt;</a></li>
1708        <li><a href=#unexpected-markup-in-tables><span class=secno>12.2.8.3 </span>Unexpected markup in tables</a></li>
1709        <li><a href=#scripts-that-modify-the-page-as-it-is-being-parsed><span class=secno>12.2.8.4 </span>Scripts that modify the page as it is being parsed</a></li>
1710        <li><a href=#the-execution-of-scripts-that-are-moving-across-multiple-documents><span class=secno>12.2.8.5 </span>The execution of scripts that are moving across multiple documents</a></li>
1711        <li><a href=#unclosed-formatting-elements><span class=secno>12.2.8.6 </span>Unclosed formatting elements</a></ol></ol></li>
1712    <li><a href=#serializing-html-fragments><span class=secno>12.3 </span>Serializing HTML fragments</a></li>
1713    <li><a href=#parsing-html-fragments><span class=secno>12.4 </span>Parsing HTML fragments</a></li>
1714    <li><a href=#named-character-references><span class=secno>12.5 </span>Named character references</a></ol></li>
1715  <li><a href=#the-xhtml-syntax><span class=secno>13 </span>The XHTML syntax</a>
1716   <ol>
1717    <li><a href=#writing-xhtml-documents><span class=secno>13.1 </span>Writing XHTML documents</a></li>
1718    <li><a href=#parsing-xhtml-documents><span class=secno>13.2 </span>Parsing XHTML documents</a></li>
1719    <li><a href=#serializing-xhtml-fragments><span class=secno>13.3 </span>Serializing XHTML fragments</a></li>
1720    <li><a href=#parsing-xhtml-fragments><span class=secno>13.4 </span>Parsing XHTML fragments</a></ol></li>
1721  <li><a href=#rendering><span class=secno>14 </span>Rendering</a>
1722   <ol>
1723    <li><a href=#introduction-13><span class=secno>14.1 </span>Introduction</a></li>
1724    <li><a href=#the-css-user-agent-style-sheet-and-presentational-hints><span class=secno>14.2 </span>The CSS user agent style sheet and presentational hints</a></li>
1725    <li><a href=#non-replaced-elements><span class=secno>14.3 </span>Non-replaced elements</a>
1726     <ol>
1727      <li><a href=#hidden-elements><span class=secno>14.3.1 </span>Hidden elements</a></li>
1728      <li><a href=#the-page><span class=secno>14.3.2 </span>The page</a></li>
1729      <li><a href=#flow-content-1><span class=secno>14.3.3 </span>Flow content</a></li>
1730      <li><a href=#phrasing-content-1><span class=secno>14.3.4 </span>Phrasing content</a></li>
1731      <li><a href=#bidirectional-text><span class=secno>14.3.5 </span>Bidirectional text</a></li>
1732      <li><a href=#quotes><span class=secno>14.3.6 </span>Quotes</a></li>
1733      <li><a href=#sections-and-headings><span class=secno>14.3.7 </span>Sections and headings</a></li>
1734      <li><a href=#lists><span class=secno>14.3.8 </span>Lists</a></li>
1735      <li><a href=#tables><span class=secno>14.3.9 </span>Tables</a></li>
1736      <li><a href=#margin-collapsing-quirks><span class=secno>14.3.10 </span>Margin collapsing quirks</a></li>
1737      <li><a href=#form-controls><span class=secno>14.3.11 </span>Form controls</a></li>
1738      <li><a href=#the-hr-element-0><span class=secno>14.3.12 </span>The <code>hr</code> element</a></li>
1739      <li><a href=#the-fieldset-and-legend-elements><span class=secno>14.3.13 </span>The <code>fieldset</code> and <code>legend</code> elements</a></ol></li>
1740    <li><a href=#replaced-elements><span class=secno>14.4 </span>Replaced elements</a>
1741     <ol>
1742      <li><a href=#embedded-content-2><span class=secno>14.4.1 </span>Embedded content</a></li>
1743      <li><a href=#images-0><span class=secno>14.4.2 </span>Images</a></li>
1744      <li><a href=#attributes-for-embedded-content-and-images><span class=secno>14.4.3 </span>Attributes for embedded content and images</a></li>
1745      <li><a href=#image-maps-0><span class=secno>14.4.4 </span>Image maps</a></ol></li>
1746    <li><a href=#bindings><span class=secno>14.5 </span>Bindings</a>
1747     <ol>
1748      <li><a href=#introduction-14><span class=secno>14.5.1 </span>Introduction</a></li>
1749      <li><a href=#the-button-element-0><span class=secno>14.5.2 </span>The <code>button</code> element</a></li>
1750      <li><a href=#the-details-element-0><span class=secno>14.5.3 </span>The <code>details</code> element</a></li>
1751      <li><a href=#the-input-element-as-a-text-entry-widget><span class=secno>14.5.4 </span>The <code>input</code> element as a text entry widget</a></li>
1752      <li><a href=#the-input-element-as-domain-specific-widgets><span class=secno>14.5.5 </span>The <code>input</code> element as domain-specific widgets</a></li>
1753      <li><a href=#the-input-element-as-a-range-control><span class=secno>14.5.6 </span>The <code>input</code> element as a range control</a></li>
1754      <li><a href=#the-input-element-as-a-color-well><span class=secno>14.5.7 </span>The <code>input</code> element as a color well</a></li>
1755      <li><a href=#the-input-element-as-a-checkbox-and-radio-button-widgets><span class=secno>14.5.8 </span>The <code>input</code> element as a checkbox and radio button widgets</a></li>
1756      <li><a href=#the-input-element-as-a-file-upload-control><span class=secno>14.5.9 </span>The <code>input</code> element as a file upload control</a></li>
1757      <li><a href=#the-input-element-as-a-button><span class=secno>14.5.10 </span>The <code>input</code> element as a button</a></li>
1758      <li><a href=#the-marquee-element-0><span class=secno>14.5.11 </span>The <code>marquee</code> element</a></li>
1759      <li><a href=#the-meter-element-0><span class=secno>14.5.12 </span>The <code>meter</code> element</a></li>
1760      <li><a href=#the-progress-element-0><span class=secno>14.5.13 </span>The <code>progress</code> element</a></li>
1761      <li><a href=#the-select-element-0><span class=secno>14.5.14 </span>The <code>select</code> element</a></li>
1762      <li><a href=#the-textarea-element-0><span class=secno>14.5.15 </span>The <code>textarea</code> element</a></li>
1763      <li><a href=#the-keygen-element-0><span class=secno>14.5.16 </span>The <code>keygen</code> element</a></ol></li>
1764    <li><a href=#frames-and-framesets><span class=secno>14.6 </span>Frames and framesets</a></li>
1765    <li><a href=#interactive-media><span class=secno>14.7 </span>Interactive media</a>
1766     <ol>
1767      <li><a href=#links,-forms,-and-navigation><span class=secno>14.7.1 </span>Links, forms, and navigation</a></li>
1768      <li><a href=#the-title-attribute-0><span class=secno>14.7.2 </span>The <code title=attr-title>title</code> attribute</a></li>
1769      <li><a href=#editing-hosts><span class=secno>14.7.3 </span>Editing hosts</a></li>
1770      <li><a href=#text-rendered-in-native-user-interfaces><span class=secno>14.7.4 </span>Text rendered in native user interfaces</a></ol></li>
1771    <li><a href=#print-media><span class=secno>14.8 </span>Print media</a></li>
1772    <li><a href=#unstyled-xml-documents><span class=secno>14.9 </span>Unstyled XML documents</a></ol></li>
1773  <li><a href=#obsolete><span class=secno>15 </span>Obsolete features</a>
1774   <ol>
1775    <li><a href=#obsolete-but-conforming-features><span class=secno>15.1 </span>Obsolete but conforming features</a>
1776     <ol>
1777      <li><a href=#warnings-for-obsolete-but-conforming-features><span class=secno>15.1.1 </span>Warnings for obsolete but conforming features</a></ol></li>
1778    <li><a href=#non-conforming-features><span class=secno>15.2 </span>Non-conforming features</a></li>
1779    <li><a href=#requirements-for-implementations><span class=secno>15.3 </span>Requirements for implementations</a>
1780     <ol>
1781      <li><a href=#the-applet-element><span class=secno>15.3.1 </span>The <code>applet</code> element</a></li>
1782      <li><a href=#the-marquee-element><span class=secno>15.3.2 </span>The <code>marquee</code> element</a></li>
1783      <li><a href=#frames><span class=secno>15.3.3 </span>Frames</a></li>
1784      <li><a href=#other-elements,-attributes-and-apis><span class=secno>15.3.4 </span>Other elements, attributes and APIs</a></ol></ol></li>
1785  <li><a href=#iana><span class=secno>16 </span>IANA considerations</a>
1786   <ol>
1787    <li><a href=#text/html><span class=secno>16.1 </span><code>text/html</code></a></li>
1788    <li><a href=#multipart/x-mixed-replace><span class=secno>16.2 </span><code>multipart/x-mixed-replace</code></a></li>
1789    <li><a href=#application/xhtml+xml><span class=secno>16.3 </span><code>application/xhtml+xml</code></a></li>
1790    <li><a href=#application/x-www-form-urlencoded><span class=secno>16.4 </span><code>application/x-www-form-urlencoded</code></a></li>
1791    <li><a href=#text/cache-manifest><span class=secno>16.5 </span><code>text/cache-manifest</code></a></li>
1792    <li><a href=#text/ping><span class=secno>16.6 </span><code>text/ping</code></a></li>
1793    <li><a href=#application/microdata+json><span class=secno>16.7 </span><code>application/microdata+json</code></a></li>
1794    <li><a href=#ping-from><span class=secno>16.8 </span><code>Ping-From</code></a></li>
1795    <li><a href=#ping-to><span class=secno>16.9 </span><code>Ping-To</code></a></li>
1796    <li><a href=#web+-scheme-prefix><span class=secno>16.10 </span><code>web+</code> scheme prefix</a></ol></li>
1797  <li><a href=#index class=no-num>Index</a>
1798   <ol>
1799    <li><a href=#elements-1 class=no-num>Elements</a></li>
1800    <li><a href=#element-content-categories class=no-num>Element content categories</a></li>
1801    <li><a href=#attributes-1 class=no-num>Attributes</a></li>
1802    <li><a href=#element-interfaces class=no-num>Element Interfaces</a></li>
1803    <li><a href=#all-interfaces class=no-num>All Interfaces</a></ol></li>
1804  <li><a href=#references class=no-num>References</a></li>
1805  <li><a href=#acknowledgments class=no-num>Acknowledgments</a></ol>
1806 <!--end-toc-->
1807   <hr><h2 id=introduction><span class=secno>1 </span>Introduction</h2>
1808
1809
1810   <h3 id=abstract><span class=secno>1.1 </span>Where does this specification fit?</h3>
1811
1812   <p>This specification defines a big part of the Web platform, in
1813   lots of detail. Its place in the Web platform specification stack
1814   relative to other specifications can be best summed up as
1815   follows:</p>
1816
1817   <p><img src=http://images.whatwg.org/abstract.png width=398 alt="It consists of everything else, above such core technologies as HTTP, URI/IRIs, DOM, XML, Unicode, and ECMAScript; below presentation-layer technologies like CSS, XBL, and the NPAPI; and to the side of technologies like Geolocation, SVG, MathML, and XHR." height=359></p>
1818
1819
1820
1821   <h3 id=is-this-html5?><span class=secno>1.2 </span>Is this HTML5?</h3><!--VERSION-->
1822
1823   <p><i>This section is non-normative.</i></p>
1824
1825   <p>In short: Yes.</p>
1826
1827   <p>In more length: The term "HTML5" is widely used as a buzzword to
1828   refer to modern Web technologies, many of which (though by no means
1829   all) are developed at the WHATWG, in some cases in conjunction with
1830   the W3C and IETF.</p>
1831
1832   <p>The WHATWG work is all published in one specification
1833
1834   (the one you are reading right now),
1835   parts of which are republished in an edition optimized for Web developers.
1836
1837   </p>
1838
1839   <p>The W3C also publishes parts of this specification as separate
1840   documents. One of these parts is called "HTML5"; it is a forked subset of
1841
1842   this specification (the HTML Living Standard).
1843   There are numerous differences between 
1844
1845   this specification (the HTML Living Standard)
1846   and the W3C version, some minor, some major. Unfortunately these are not currently accurately
1847   documented anywhere, so there is no way to know which are intentional and which are not.</p>
1848
1849
1850
1851   <h3 id=background><span class=secno>1.3 </span>Background</h3>
1852
1853   <p><i>This section is non-normative.</i></p>
1854
1855   <p>The World Wide Web's markup language has always been HTML. HTML was primarily designed as a
1856   language for semantically describing scientific documents, although its general design and
1857   adaptations over the years have enabled it to be used to describe a number of other types of
1858   documents.</p>
1859
1860   <p>The main area that has not been adequately addressed by HTML is a vague subject referred to as
1861   Web Applications. This specification attempts to rectify this, while at the same time updating the
1862   HTML specifications to address issues raised in the past few years.</p>
1863
1864
1865   <h3 id=audience><span class=secno>1.4 </span>Audience</h3>
1866
1867   <p><i>This section is non-normative.</i></p>
1868
1869   <p>This specification is intended for authors of documents and scripts that use the features
1870   defined in this specification<span class=impl>, implementors of tools that operate on pages that
1871   use the features defined in this specification, and individuals wishing to establish the
1872   correctness of documents or implementations with respect to the requirements of this
1873   specification</span>.</p>
1874
1875   <p>This document is probably not suited to readers who do not already have at least a passing
1876   familiarity with Web technologies, as in places it sacrifices clarity for precision, and brevity
1877   for completeness. More approachable tutorials and authoring guides can provide a gentler
1878   introduction to the topic.</p>
1879
1880   <p>In particular, familiarity with the basics of DOM is necessary for a complete understanding of
1881   some of the more technical parts of this specification. An understanding of Web IDL, HTTP, XML,
1882   Unicode, character encodings, JavaScript, and CSS will also be helpful in places but is not
1883   essential.</p>
1884
1885
1886   <h3 id=scope><span class=secno>1.5 </span>Scope</h3>
1887
1888   <p><i>This section is non-normative.</i></p>
1889
1890   <p>This specification is limited to providing a semantic-level markup language and associated
1891   semantic-level scripting APIs for authoring accessible pages on the Web ranging from static
1892   documents to dynamic applications.</p>
1893
1894   <p>The scope of this specification does not include providing mechanisms for media-specific
1895   customization of presentation (although default rendering rules for Web browsers are included at
1896   the end of this specification, and several mechanisms for hooking into CSS are provided as part of
1897   the language).</p>
1898
1899   <p>The scope of this specification is not to describe an entire operating system. In particular,
1900   hardware configuration software, image manipulation tools, and applications that users would be
1901   expected to use with high-end workstations on a daily basis are out of scope. In terms of
1902   applications, this specification is targeted specifically at applications that would be expected
1903   to be used by users on an occasional basis, or regularly but from disparate locations, with low
1904   CPU requirements. Examples of such applications include online purchasing systems, searching
1905   systems, games (especially multiplayer online games), public telephone books or address books,
1906   communications software (e-mail clients, instant messaging clients, discussion software), document
1907   editing software, etc.</p>
1908
1909
1910   <h3 id=history-1><span class=secno>1.6 </span>History</h3>
1911
1912   <p><i>This section is non-normative.</i></p>
1913
1914   <p>For its first five years (1990-1995), HTML went through a number of revisions and experienced a
1915   number of extensions, primarily hosted first at CERN, and then at the IETF.</p>
1916
1917   <p>With the creation of the W3C, HTML's development changed venue again. A first abortive attempt
1918   at extending HTML in 1995 known as HTML 3.0 then made way to a more pragmatic approach known as
1919   HTML 3.2, which was completed in 1997. HTML4 quickly followed later that same year.</p>
1920
1921   <p>The following year, the W3C membership decided to stop evolving HTML and instead begin work on
1922   an XML-based equivalent, called XHTML. <!-- http://www.w3.org/MarkUp/future/#summary --> This
1923   effort started with a reformulation of HTML4 in XML, known as XHTML 1.0, which added no new
1924   features except the new serialization, and which was completed in 2000. After XHTML 1.0, the W3C's
1925   focus turned to making it easier for other working groups to extend XHTML, under the banner of
1926   XHTML Modularization. In parallel with this, the W3C also worked on a new language that was not
1927   compatible with the earlier HTML and XHTML languages, calling it XHTML2.</p>
1928
1929   <p>Around the time that HTML's evolution was stopped in 1998, parts of the API for HTML developed
1930   by browser vendors were specified and published under the name DOM Level 1 (in 1998) and DOM Level
1931   2 Core and DOM Level 2 HTML (starting in 2000 and culminating in 2003). These efforts then petered
1932   out, with some DOM Level 3 specifications published in 2004 but the working group being closed
1933   before all the Level 3 drafts were completed.</p>
1934
1935   <p>In 2003, the publication of XForms, a technology which was positioned as the next generation of
1936   Web forms, sparked a renewed interest in evolving HTML itself, rather than finding replacements
1937   for it. This interest was borne from the realization that XML's deployment as a Web technology was
1938   limited to entirely new technologies (like RSS and later Atom), rather than as a replacement for
1939   existing deployed technologies (like HTML).</p>
1940
1941   <p>A proof of concept to show that it was possible to extend HTML4's forms to provide many of the
1942   features that XForms 1.0 introduced, without requiring browsers to implement rendering engines
1943   that were incompatible with existing HTML Web pages, was the first result of this renewed
1944   interest. At this early stage, while the draft was already publicly available, and input was
1945   already being solicited from all sources, the specification was only under Opera Software's
1946   copyright.</p>
1947
1948   <p>The idea that HTML's evolution should be reopened was tested at a W3C workshop in 2004, where
1949   some of the principles that underlie the HTML5 work (described below), as well as the
1950   aforementioned early draft proposal covering just forms-related features, were presented to the
1951   W3C jointly by Mozilla and Opera. The proposal was rejected on the grounds that the proposal
1952   conflicted with the previously chosen direction for the Web's evolution; the W3C staff and
1953   membership voted to continue developing XML-based replacements instead.</p>
1954
1955   <p>Shortly thereafter, Apple, Mozilla, and Opera jointly announced their intent to continue
1956   working on the effort under the umbrella of a new venue called the WHATWG. A public mailing list
1957   was created, and the draft was moved to the WHATWG site. The copyright was subsequently amended to
1958   be jointly owned by all three vendors, and to allow reuse of the specification.</p>
1959
1960   <p>The WHATWG was based on several core principles, in particular that technologies need to be
1961   backwards compatible, that specifications and implementations need to match even if this means
1962   changing the specification rather than the implementations, and that specifications need to be
1963   detailed enough that implementations can achieve complete interoperability without
1964   reverse-engineering each other.</p>
1965
1966   <p>The latter requirement in particular required that the scope of the HTML5 specification include
1967   what had previously been specified in three separate documents: HTML4, XHTML1, and DOM2 HTML. It
1968   also meant including significantly more detail than had previously been considered the norm.</p>
1969
1970   <p>In 2006, the W3C indicated an interest to participate in the development of HTML5 after all,
1971   and in 2007 formed a working group chartered to work with the WHATWG on the development of the
1972   HTML5 specification. Apple, Mozilla, and Opera allowed the W3C to publish the specification under
1973   the W3C copyright, while keeping a version with the less restrictive license on the WHATWG
1974   site.</p>
1975
1976   <p>For a number of years, both groups then worked together. In 2011, however, the groups came to
1977   the conclusion that they had different goals: the W3C wanted to publish a "finished" version of
1978   "HTML5", while the WHATWG wanted to continue working on a Living Standard for HTML, continuously
1979   maintaining the specification rather than freezing it in a state with known problems, and adding
1980   new features as needed to evolve the platform.</p>
1981
1982   <p>Since then, the WHATWG has been working on this specification (amongst others), and the W3C has
1983   been copying fixes made by the WHATWG into their fork of the document, as well as making other
1984   changes, some intentional and some not, with no documentation listing or explaining the
1985   differences.</p>
1986
1987
1988
1989
1990   <h3 id=design-notes><span class=secno>1.7 </span>Design notes</h3>
1991
1992   <p><i>This section is non-normative.</i></p>
1993
1994   <p>It must be admitted that many aspects of HTML appear at first glance to be nonsensical and
1995   inconsistent.</p>
1996
1997   <p>HTML, its supporting DOM APIs, as well as many of its supporting technologies, have been
1998   developed over a period of several decades by a wide array of people with different priorities
1999   who, in many cases, did not know of each other's existence.</p>
2000
2001   <p>Features have thus arisen from many sources, and have not always been designed in especially
2002   consistent ways. Furthermore, because of the unique characteristics of the Web, implementation
2003   bugs have often become de-facto, and now de-jure, standards, as content is often unintentionally
2004   written in ways that rely on them before they can be fixed.</p>
2005
2006   <p>Despite all this, efforts have been made to adhere to certain design goals. These are described
2007   in the next few subsections.</p>
2008
2009
2010   <h4 id=serializability-of-script-execution><span class=secno>1.7.1 </span>Serializability of script execution</h4>
2011
2012   <p><i>This section is non-normative.</i></p>
2013
2014   <p>To avoid exposing Web authors to the complexities of multithreading, the HTML and DOM APIs are
2015   designed such that no script can ever detect the simultaneous execution of other scripts. Even
2016   with <a href=#worker title=Worker>workers</a>, the intent is that the behavior of implementations can
2017   be thought of as completely serializing the execution of all scripts in all <a href=#browsing-context title="browsing
2018   context">browsing contexts</a>.</p>
2019
2020   <p class=note>The <code title=dom-navigator-yieldForStorageUpdates><a href=#dom-navigator-yieldforstorageupdates>navigator.yieldForStorageUpdates()</a></code> method, in
2021   this model, is equivalent to allowing other scripts to run while the calling script is
2022   blocked.</p>
2023
2024
2025   <h4 id=compliance-with-other-specifications><span class=secno>1.7.2 </span>Compliance with other specifications</h4>
2026
2027   <p><i>This section is non-normative.</i></p>
2028
2029   <p>This specification interacts with and relies on a wide variety of other specifications. In
2030   certain circumstances, unfortunately, conflicting needs have led to this specification violating
2031   the requirements of these other specifications. Whenever this has occurred, the transgressions
2032   have each been noted as a "<dfn id=willful-violation>willful violation</dfn>", and the reason for the violation has
2033   been noted.</p>
2034
2035
2036   <h4 id=extensibility><span class=secno>1.7.3 </span>Extensibility</h4>
2037
2038   <p><i>This section is non-normative.</i></p>
2039
2040   <p>HTML has a wide number of extensibility mechanisms that can be used for adding semantics in a
2041   safe manner:</p>
2042
2043   <ul><li>Authors can use the <code title=attr-class><a href=#classes>class</a></code> attribute to extend elements,
2044    effectively creating their own elements, while using the most applicable existing "real" HTML
2045    element, so that browsers and other tools that don't know of the extension can still support it
2046    somewhat well. This is the tack used by microformats, for example.</li>
2047
2048    <li>Authors can include data for inline client-side scripts or server-side site-wide scripts to
2049    process using the <code title=attr-data-*><a href=#attr-data-*>data-*=""</a></code> attributes. These are guaranteed to
2050    never be touched by browsers, and allow scripts to include data on HTML elements that scripts can
2051    then look for and process.</li>
2052
2053    <li>Authors can use the <code title=meta><a href=#the-meta-element>&lt;meta name="" content=""&gt;</a></code> mechanism to
2054    include page-wide metadata by registering <a href=#concept-meta-extensions title=concept-meta-extensions>extensions to the
2055    predefined set of metadata names</a>.</li>
2056
2057    <li>Authors can use the <code title=attr-hyperlink-rel><a href=#attr-hyperlink-rel>rel=""</a></code> mechanism to annotate
2058    links with specific meanings by registering <a href=#concept-rel-extensions title=concept-rel-extensions>extensions to
2059    the predefined set of link types</a>. This is also used by microformats.</li>
2060
2061    <li>Authors can embed raw data using the <code title=script><a href=#the-script-element>&lt;script type=""&gt;</a></code>
2062    mechanism with a custom type, for further handling by inline or server-side scripts.</li>
2063
2064    <li>Authors can create <a href=#plugin title=plugin>plugins</a> and invoke them using the
2065    <code><a href=#the-embed-element>embed</a></code> element. This is how Flash works.</li>
2066
2067    <li>Authors can extend APIs using the JavaScript prototyping mechanism. This is widely used by
2068    script libraries, for instance.</li>
2069
2070    <li>Authors can use the microdata feature (the <code title=attr-itemscope><a href=#attr-itemscope>itemscope=""</a></code>
2071    and <code title=attr-itemprop><a href=#names:-the-itemprop-attribute>itemprop=""</a></code> attributes) to embed nested name-value pairs
2072    of data to be shared with other applications and sites.</li>
2073
2074   </ul><h3 id=html-vs-xhtml><span class=secno>1.8 </span>HTML vs XHTML</h3>
2075
2076   <p><i>This section is non-normative.</i></p>
2077
2078   <p>This specification defines an abstract language for describing documents and applications, and
2079   some APIs for interacting with in-memory representations of resources that use this language.</p>
2080
2081   <p>The in-memory representation is known as "DOM HTML", or "the DOM" for short.</p>
2082
2083   <p>There are various concrete syntaxes that can be used to transmit resources that use this
2084   abstract language, two of which are defined in this specification.</p>
2085
2086   <p>The first such concrete syntax is the HTML syntax. This is the format suggested for most
2087   authors. It is compatible with most legacy Web browsers. If a document is transmitted with the
2088   <code><a href=#text/html>text/html</a></code> <a href=#mime-type>MIME type</a>, then it will be processed as an HTML document by
2089   Web browsers. This specification defines the latest HTML syntax, known simply as "HTML".</p>
2090
2091   <p>The second concrete syntax is the XHTML syntax, which is an application of XML. When a document
2092   is transmitted with an <a href=#xml-mime-type>XML MIME type</a>, such as <code><a href=#application/xhtml+xml>application/xhtml+xml</a></code>,
2093   then it is treated as an XML document by Web browsers, to be parsed by an XML processor. Authors
2094   are reminded that the processing for XML and HTML differs; in particular, even minor syntax errors
2095   will prevent a document labeled as XML from being rendered fully, whereas they would be ignored in
2096   the HTML syntax. This specification defines the latest XHTML syntax, known simply as "XHTML".</p>
2097
2098   <p>The DOM, the HTML syntax, and the XHTML syntax cannot all represent the same content. For
2099   example, namespaces cannot be represented using the HTML syntax, but they are supported in the DOM
2100   and in the XHTML syntax. Similarly, documents that use the <code><a href=#the-noscript-element>noscript</a></code> feature can be
2101   represented using the HTML syntax, but cannot be represented with the DOM or in the XHTML syntax.
2102   Comments that contain the string "<code title="">--&gt;</code>" can only be represented in the
2103   DOM, not in the HTML and XHTML syntaxes.</p>
2104
2105
2106   <h3 id=structure-of-this-specification><span class=secno>1.9 </span>Structure of this specification</h3>
2107
2108   <p><i>This section is non-normative.</i></p>
2109
2110   <p>This specification is divided into the following major sections:</p>
2111
2112   <dl><dt><a href=#introduction>Introduction</a></dt>
2113
2114    <dd>Non-normative materials providing a context for the HTML standard.</dd>
2115
2116
2117    <dt><a href=#infrastructure>Common infrastructure</a></dt>
2118
2119    <dd>The conformance classes, algorithms, definitions, and the common underpinnings of the rest of
2120    the specification.</dd>
2121
2122
2123    <dt><a href=#dom>Semantics, structure, and APIs of HTML documents</a></dt>
2124
2125    <dd>Documents are built from elements. These elements form a tree using the DOM. This section
2126    defines the features of this DOM, as well as introducing the features common to all elements, and
2127    the concepts used in defining elements.</dd>
2128
2129
2130    <dt><a href=#semantics>The elements of HTML</a></dt>
2131
2132    <dd>Each element has a predefined meaning, which is explained in this section. Rules for authors
2133    on how to use the element<span class=impl>, along with user agent requirements for how to
2134    handle each element,</span> are also given. This includes large signature features of HTML such
2135    as video playback and subtitles, form controls and form submission, and a 2D graphics API known
2136    as the HTML canvas.</dd>
2137
2138
2139    <dt><a href=#microdata>Microdata</a></dt>
2140
2141    <dd>This specification introduces a mechanism for adding machine-readable annotations to
2142    documents, so that tools can extract trees of name-value pairs from the document. This section
2143    describes this mechanism<span class=impl> and some algorithms that can be used to convert HTML
2144    documents into other formats</span>. This section also defines some sample Microdata vocabularies
2145    for contact information, calendar events, and licensing works.</dd>
2146
2147
2148    <dt><a href=#browsers>Loading Web pages</a></dt>
2149
2150    <dd>HTML documents do not exist in a vacuum &mdash; this section defines many of the features
2151    that affect environments that deal with multiple pages, such as Web browsers and offline
2152    caching of Web applications.</dd>
2153
2154
2155    <dt><a href=#webappapis>Web application APIs</a></dt>
2156
2157    <dd>This section introduces basic features for scripting of applications in HTML.</dd>
2158
2159
2160    <dt><a href=#editing>User interaction</a></dt>
2161
2162    <dd>HTML documents can provide a number of mechanisms for users to interact with and modify
2163    content, which are described in this section, such as how focus works, and drag-and-drop.</dd>
2164
2165
2166    <dt><a href=#workers>Web workers</a></dt>
2167
2168    <dd>This section defines an API for background threads in JavaScript.</dd>
2169
2170
2171    <dt><a href=#comms>The communication APIs</a></dt>
2172
2173    <dd>This section describes some mechanisms that applications written in HTML can use to
2174    communicate with other applications from different domains running on the same client. It also
2175    introduces a server-push event stream mechanism known as Server Sent Events or
2176    <code><a href=#eventsource>EventSource</a></code>, and a two-way full-duplex socket protocol for scripts known as Web
2177    Sockets.
2178
2179    </dd>
2180
2181
2182    <dt><a href=#webstorage>Web storage</a></dt>
2183
2184    <dd>This section defines a client-side storage mechanism based on name-value pairs.</dd>
2185
2186
2187    <dt><a href=#syntax>The HTML syntax</a></dt>
2188    <dt><a href=#xhtml>The XHTML syntax</a></dt>
2189
2190    <dd>All of these features would be for naught if they couldn't be represented in a serialized
2191    form and sent to other people, and so these sections define the syntaxes of HTML and XHTML<span class=impl>, along with rules for how to parse content using those syntaxes</span>.</dd>
2192
2193
2194    <dt><a href=#rendering>Rendering</a></dt>
2195
2196    <dd>This section defines the default rendering rules for Web browsers.</dd>
2197
2198
2199   </dl><p>There are also some appendices, listing <a href=#obsolete>obsolete features</a> and <a href=#iana>IANA considerations</a>, and several indices.</p>
2200
2201
2202
2203   <h4 id=how-to-read-this-specification><span class=secno>1.9.1 </span>How to read this specification</h4>
2204
2205   <p>This specification should be read like all other specifications. First, it should be read
2206   cover-to-cover, multiple times. Then, it should be read backwards at least once. Then it should be
2207   read by picking random sections from the contents list and following all the cross-references.</p>
2208
2209   <p>As described in the conformance requirements section below, this specification describes
2210   conformance criteria for a variety of conformance classes. In particular, there are conformance
2211   requirements that apply to <em>producers</em>, for example authors and the documents they create,
2212   and there are conformance requirements that apply to <em>consumers</em>, for example Web browsers.
2213   They can be distinguished by what they are requiring: a requirement on a producer states what is
2214   allowed, while a requirement on a consumer states how software is to act.</p>
2215
2216   <div class=example>
2217
2218    <p>For example, "the <code title="">foo</code> attribute's value must be a <a href=#valid-integer>valid
2219    integer</a>" is a requirement on producers, as it lays out the allowed values; in contrast,
2220    the requirement "the <code title="">foo</code> attribute's value must be parsed using the
2221    <a href=#rules-for-parsing-integers>rules for parsing integers</a>" is a requirement on consumers, as it describes how to
2222    process the content.</p>
2223
2224   </div>
2225
2226   <p><strong>Requirements on producers have no bearing whatsoever on consumers.</strong></p>
2227
2228   <div class=example>
2229
2230    <p>Continuing the above example, a requirement stating that a particular attribute's value is
2231    constrained to being a <a href=#valid-integer>valid integer</a> emphatically does <em>not</em> imply anything
2232    about the requirements on consumers. It might be that the consumers are in fact required to treat
2233    the attribute as an opaque string, completely unaffected by whether the value conforms to the
2234    requirements or not. It might be (as in the previous example) that the consumers are required to
2235    parse the value using specific rules that define how invalid (non-numeric in this case) values
2236    are to be processed.</p>
2237
2238   </div>
2239
2240
2241
2242   <h4 id=typographic-conventions><span class=secno>1.9.2 </span>Typographic conventions</h4>
2243
2244   <p>This is a definition, requirement, or explanation.</p>
2245
2246   <p class=note>This is a note.</p>
2247
2248   <p class=example>This is an example.</p>
2249
2250   <p class=XXX>This is an open issue.</p>
2251
2252   <p class=warning>This is a warning.</p>
2253
2254   <pre class="idl extract">interface <dfn title="">Example</dfn> {
2255   // this is an IDL definition
2256 };</pre>
2257
2258   <dl class=domintro><dt><var title="">variable</var> = <var title="">object</var> . <code title="">method</code>( [ <var title="">optionalArgument</var> ] )</dt>
2259
2260    <dd>
2261
2262     <p>This is a note to authors describing the usage of an interface.</p>
2263
2264    </dd>
2265
2266   </dl><pre class=css>/* this is a CSS fragment */</pre>
2267
2268   <p>The defining instance of a term is marked up like <dfn id=x-this title=x-this>this</dfn>. Uses of that
2269   term are marked up like <a href=#x-this title=x-this>this</a> or like <i title=x-this><a href=#x-this>this</a></i>.</p>
2270
2271   <p>The defining instance of an element, attribute, or API is marked up like <dfn id=x-that title=x-that><code>this</code></dfn>. References to that element, attribute, or API are marked
2272   up like <code title=x-that><a href=#x-that>this</a></code>.</p>
2273
2274   <p>Other code fragments are marked up <code title="">like this</code>.</p>
2275
2276   <p>Variables are marked up like <var title="">this</var>.</p>
2277
2278   <!--<p class="impl">This is an implementation requirement.</p>-->
2279
2280   <p>In an algorithm, steps in <a href=#synchronous-section title="synchronous section">synchronous sections</a> are
2281   marked with &#x231b;.</p>
2282
2283   <p>In some cases, requirements are given in the form of lists with conditions and corresponding
2284   requirements. In such cases, the requirements that apply to a condition are always the first set
2285   of requirements that follow the condition, even in the case of there being multiple sets of
2286   conditions for those requirements. Such cases are presented as follows:</p>
2287
2288   <dl class=switch><dt>This is a condition
2289    <dt>This is another condition
2290    </dt><dd>This is the requirement that applies to the conditions above.
2291
2292    <dt>This is a third condition
2293    <dd>This is the requirement that applies to the third condition.
2294
2295   </dl><h3 id=fingerprint><span class=secno>1.10 </span>Privacy concerns</h3>
2296
2297   <p><i>This section is non-normative.</i></p>
2298
2299   <p>Some features of HTML trade user convenience for a measure of user privacy.</p>
2300
2301   <p>In general, due to the Internet's architecture, a user can be distinguished from another by the
2302   user's IP address. IP addresses do not perfectly match to a user; as a user moves from device to
2303   device, or from network to network, their IP address will change; similarly, NAT routing, proxy
2304   servers, and shared computers enable packets that appear to all come from a single IP address to
2305   actually map to multiple users. Technologies such as onion routing can be used to further
2306   anonymize requests so that requests from a single user at one node on the Internet appear to come
2307   from many disparate parts of the network.</p>
2308
2309   <p>However, the IP address used for a user's requests is not the only mechanism by which a user's
2310   requests could be related to each other. Cookies, for example, are designed specifically to enable
2311   this, and are the basis of most of the Web's session features that enable you to log into a site
2312   with which you have an account.</p>
2313
2314   <p>There are other mechanisms that are more subtle. Certain characteristics of a user's system can
2315   be used to distinguish groups of users from each other; by collecting enough such information, an
2316   individual user's browser's "digital fingerprint" can be computed, which can be as good, if not
2317   better, as an IP address in ascertaining which requests are from the same user.</p>
2318
2319   <p>Grouping requests in this manner, especially across multiple sites, can be used for both benign
2320   (and even arguably positive) purposes, as well as for malevolent purposes. An example of a
2321   reasonably benign purpose would be determining whether a particular person seems to prefer sites
2322   with dog illustrations as opposed to sites with cat illustrations (based on how often they visit
2323   the sites in question) and then automatically using the preferred illustrations on subsequent
2324   visits to participating sites. Malevolent purposes, however, could include governments combining
2325   information such as the person's home address (determined from the addresses they use when getting
2326   driving directions on one site) with their apparent political affiliations (determined by
2327   examining the forum sites that they participate in) to determine whether the person should be
2328   prevented from voting in an election.</p>
2329
2330   <p>Since the malevolent purposes can be remarkably evil, user agent implementors are encouraged to
2331   consider how to provide their users with tools to minimize leaking information that could be used
2332   to fingerprint a user.</p>
2333
2334   <p>Unfortunately, as the first paragraph in this section implies, sometimes there is great benefit
2335   to be derived from exposing the very information that can also be used for fingerprinting
2336   purposes, so it's not as easy as simply blocking all possible leaks. For instance, the ability to
2337   log into a site to post under a specific identity requires that the user's requests be
2338   identifiable as all being from the same user, more or less by definition. More subtly, though,
2339   information such as how wide text is, which is necessary for many effects that involve drawing
2340   text onto a canvas (e.g. any effect that involves drawing a border around the text) also leaks
2341   information that can be used to group a user's requests. (In this case, by potentially exposing,
2342   via a brute force search, which fonts a user has installed, information which can vary
2343   considerably from user to user.)</p>
2344
2345   <p>Features in this specification which can be <dfn id=fingerprinting-vector title="fingerprinting vector">used to
2346   fingerprint the user</dfn> are marked as this paragraph is.
2347   <a href=#fingerprinting-vector class=fingerprint title="fingerprinting vector"><img src=http://images.whatwg.org/fingerprint.png width=46 alt="(This is a fingerprinting vector.)" height=64></a>
2348   </p>
2349
2350   <p>Other features in the platform can be used for the same purpose, though, including, though not
2351   limited to:</p>
2352
2353   <ul><li>The exact list of which features a user agents supports.</li>
2354
2355    <li>The maximum allowed stack depth for recursion in script.</li>
2356
2357    <li>Features that describe the user's environment, like Media Queries and the <code><a href=#screen>Screen</a></code>
2358    object. <a href=#refsMQ>[MQ]</a> <a href=#refsCSSOMVIEW>[CSSOMVIEW]</a></li>
2359
2360    <li>The user's time zone.</li>
2361
2362   </ul><h3 id=a-quick-introduction-to-html><span class=secno>1.11 </span>A quick introduction to HTML</h3>
2363
2364   <p><i>This section is non-normative.</i></p>
2365
2366   <p>A basic HTML document looks like this:</p>
2367
2368   <pre id=intro-early-example>&lt;!DOCTYPE html&gt;
2369 &lt;html&gt;
2370  &lt;head&gt;
2371   &lt;title&gt;Sample page&lt;/title&gt;
2372  &lt;/head&gt;
2373  &lt;body&gt;
2374   &lt;h1&gt;Sample page&lt;/h1&gt;
2375   &lt;p&gt;This is a &lt;a href="demo.html"&gt;simple&lt;/a&gt; sample.&lt;/p&gt;
2376   &lt;!-- this is a comment --&gt;
2377  &lt;/body&gt;
2378 &lt;/html&gt;</pre>
2379
2380   <p>HTML documents consist of a tree of elements and text. Each element is denoted in the source by
2381   a <a href=#syntax-start-tag title=syntax-start-tag>start tag</a>, such as "<code title="">&lt;body&gt;</code>", and
2382   an <a href=#syntax-end-tag title=syntax-end-tag>end tag</a>, such as "<code title="">&lt;/body&gt;</code>".
2383   (Certain start tags and end tags can in certain cases be <a href=#syntax-tag-omission title=syntax-tag-omission>omitted</a> and are implied by other tags.)</p>
2384
2385   <p>Tags have to be nested such that elements are all completely within each other, without
2386   overlapping:</p>
2387
2388   <pre class=bad>&lt;p&gt;This is &lt;em&gt;very &lt;strong&gt;wrong&lt;/em&gt;!&lt;/strong&gt;&lt;/p&gt;</pre>
2389   <pre>&lt;p&gt;This &lt;em&gt;is &lt;strong&gt;correct&lt;/strong&gt;.&lt;/em&gt;&lt;/p&gt;</pre>
2390
2391   <p>This specification defines a set of elements that can be used in HTML, along with rules about
2392   the ways in which the elements can be nested.</p>
2393
2394   <p>Elements can have attributes, which control how the elements work. In the example below, there
2395   is a <a href=#hyperlink>hyperlink</a>, formed using the <code><a href=#the-a-element>a</a></code> element and its <code title=attr-hyperlink-href><a href=#attr-hyperlink-href>href</a></code> attribute:</p>
2396
2397   <pre>&lt;a href="demo.html"&gt;simple&lt;/a&gt;</pre>
2398
2399   <p><a href=#syntax-attributes title=syntax-attributes>Attributes</a> are placed inside the start tag, and consist
2400   of a <a href=#syntax-attribute-name title=syntax-attribute-name>name</a> and a <a href=#syntax-attribute-value title=syntax-attribute-value>value</a>, separated by an "<code title="">=</code>" character.
2401   The attribute value can remain <a href=#unquoted>unquoted</a> if it doesn't contain <a href=#space-character title="space character">space characters</a> or any of <code title="">"</code> <code title="">'</code> <code title="">`</code> <code title="">=</code> <code title="">&lt;</code> or
2402   <code title="">&gt;</code>. Otherwise, it has to be quoted using either single or double quotes.
2403   The value, along with the "<code title="">=</code>" character, can be omitted altogether if the
2404   value is the empty string.</p>
2405
2406   <pre>&lt;!-- empty attributes --&gt;
2407 &lt;input name=address disabled&gt;
2408 &lt;input name=address disabled=""&gt;
2409
2410 &lt;!-- attributes with a value --&gt;
2411 &lt;input name=address maxlength=200&gt;
2412 &lt;input name=address maxlength='200'&gt;
2413 &lt;input name=address maxlength="200"&gt;</pre>
2414
2415   <p>HTML user agents (e.g. Web browsers) then <i>parse</i> this markup, turning it into a DOM
2416   (Document Object Model) tree. A DOM tree is an in-memory representation of a document.</p>
2417
2418   <p>DOM trees contain several kinds of nodes, in particular a <code><a href=#documenttype>DocumentType</a></code> node,
2419   <code><a href=#element>Element</a></code> nodes, <code><a href=#text>Text</a></code> nodes, <code><a href=#comment-0>Comment</a></code> nodes, and in some cases
2420   <code><a href=#processinginstruction>ProcessingInstruction</a></code> nodes.</p>
2421
2422   <p>The <a href=#intro-early-example>markup snippet at the top of this section</a> would be
2423   turned into the following DOM tree:</p>
2424
2425   <ul class=domTree><li class=t10>DOCTYPE: <code title="">html</code><li class=t1><code><a href=#the-html-element>html</a></code><ul><li class=t1><code><a href=#the-head-element>head</a></code><ul><li class=t3><code>#text</code>: <span title="">&#x23ce;&blank;&blank;</span><li class=t1><code><a href=#the-title-element>title</a></code><ul><li class=t3><code>#text</code>: <span title="">Sample page</span></ul><li class=t3><code>#text</code>: <span title="">&#x23ce;&blank;</span></ul><li class=t3><code>#text</code>: <span title="">&#x23ce;&blank;</span><li class=t1><code><a href=#the-body-element>body</a></code><ul><li class=t3><code>#text</code>: <span title="">&#x23ce;&blank;&blank;</span><li class=t1><code><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements>h1</a></code><ul><li class=t3><code>#text</code>: <span title="">Sample page</span></ul><li class=t3><code>#text</code>: <span title="">&#x23ce;&blank;&blank;</span><li class=t1><code><a href=#the-p-element>p</a></code><ul><li class=t3><code>#text</code>: <span title="">This is a <!--grammar-check-override--></span><li class=t1><code><a href=#the-a-element>a</a></code> <span class=t2 title=""><code class="attribute name">href</code>="<code class="attribute value">demo.html</code>"</span><ul><li class=t3><code>#text</code>: <span title="">simple</span></ul><li class=t3><code>#text</code>: <span title=""> sample.</span></ul><li class=t3><code>#text</code>: <span title="">&#x23ce;&blank;&blank;</span><li class=t8><code>#comment</code>: <span title=""> this is a comment </span><li class=t3><code>#text</code>: <span title="">&#x23ce;&blank;&#x23ce;</span></ul></ul></ul><p>The <a href=#root-element>root element</a> of this tree is the <code><a href=#the-html-element>html</a></code> element, which is the
2426   element always found at the root of HTML documents. It contains two elements, <code><a href=#the-head-element>head</a></code>
2427   and <code><a href=#the-body-element>body</a></code>, as well as a <code><a href=#text>Text</a></code> node between them.</p>
2428
2429   <p>There are many more <code><a href=#text>Text</a></code> nodes in the DOM tree than one would initially expect,
2430   because the source contains a number of spaces (represented here by "&blank;") and line breaks
2431   ("&#x23ce;") that all end up as <code><a href=#text>Text</a></code> nodes in the DOM. However, for historical
2432   reasons not all of the spaces and line breaks in the original markup appear in the DOM. In
2433   particular, all the whitespace before <code><a href=#the-head-element>head</a></code> start tag ends up being dropped silently,
2434   and all the whitespace after the <code><a href=#the-body-element>body</a></code> end tag ends up placed at the end of the
2435   <code><a href=#the-body-element>body</a></code>.</p>
2436
2437   <p>The <code><a href=#the-head-element>head</a></code> element contains a <code><a href=#the-title-element>title</a></code> element, which itself contains a
2438   <code><a href=#text>Text</a></code> node with the text "Sample page". Similarly, the <code><a href=#the-body-element>body</a></code> element
2439   contains an <code><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements>h1</a></code> element, a <code><a href=#the-p-element>p</a></code> element, and a comment.</p>
2440
2441   <hr><p>This DOM tree can be manipulated from scripts in the page. Scripts (typically in JavaScript)
2442   are small programs that can be embedded using the <code><a href=#the-script-element>script</a></code> element or using <a href=#event-handler-content-attributes>event
2443   handler content attributes</a>. For example, here is a form with a script that sets the value
2444   of the form's <code><a href=#the-output-element>output</a></code> element to say "Hello World":</p>
2445
2446   <pre>&lt;<a href=#the-form-element>form</a> <a href=#attr-form-name title=attr-form-name>name</a>="main"&gt;
2447  Result: &lt;<a href=#the-output-element>output</a> <a href=#attr-fe-name title=attr-fe-name>name</a>="result"&gt;&lt;/output&gt;
2448  &lt;<a href=#the-script-element>script</a>&gt;
2449   <a href=#document title=Document>document</a>.<a href=#dom-document-forms title=dom-document-forms>forms</a>.main.<a href=#dom-form-elements title=dom-form-elements>elements</a>.result.<a href=#dom-output-value title=dom-output-value>value</a> = 'Hello World';
2450  &lt;/script&gt;
2451 &lt;/form&gt;</pre>
2452
2453   <p>Each element in the DOM tree is represented by an object, and these objects have APIs so that
2454   they can be manipulated. For instance, a link (e.g. the <code><a href=#the-a-element>a</a></code> element in the tree above)
2455   can have its "<code title=attr-hyperlink-href><a href=#attr-hyperlink-href>href</a></code>" attribute changed in several
2456   ways:</p>
2457
2458   <pre>var a = <a href=#document title=Document>document</a>.<a href=#dom-document-links title=dom-document-links>links</a>[0]; // obtain the first link in the document
2459 a.<a href=#dom-url-href title=dom-url-href>href</a> = 'sample.html'; // change the destination URL of the link
2460 a.<a href=#dom-url-protocol title=dom-url-protocol>protocol</a> = 'https'; // change just the scheme part of the URL
2461 a.setAttribute('href', 'http://example.com/'); // change the content attribute directly</pre>
2462
2463   <p>Since DOM trees are used as the way to represent HTML documents when they are processed and
2464   presented by implementations (especially interactive implementations like Web browsers), this
2465   specification is mostly phrased in terms of DOM trees, instead of the markup described above.</p>
2466
2467   <hr><p>HTML documents represent a media-independent description of interactive content. HTML documents
2468   might be rendered to a screen, or through a speech synthesizer, or on a braille display. To
2469   influence exactly how such rendering takes place, authors can use a styling language such as
2470   CSS.</p>
2471
2472   <p>In the following example, the page has been made yellow-on-blue using CSS.</p>
2473
2474   <pre>&lt;!DOCTYPE html&gt;
2475 &lt;html&gt;
2476  &lt;head&gt;
2477   &lt;title&gt;Sample styled page&lt;/title&gt;
2478   &lt;style&gt;
2479    body { background: navy; color: yellow; }
2480   &lt;/style&gt;
2481  &lt;/head&gt;
2482  &lt;body&gt;
2483   &lt;h1&gt;Sample styled page&lt;/h1&gt;
2484   &lt;p&gt;This page is just a demo.&lt;/p&gt;
2485  &lt;/body&gt;
2486 &lt;/html&gt;</pre>
2487
2488   <p>For more details on how to use HTML, authors are encouraged to consult tutorials and guides.
2489   Some of the examples included in this specification might also be of use, but the novice author is
2490   cautioned that this specification, by necessity, defines the language with a level of detail that
2491   might be difficult to understand at first.</p>
2492
2493 <!--ADD-TOPIC:Security-->
2494   <h4 id=writing-secure-applications-with-html><span class=secno>1.11.1 </span>Writing secure applications with HTML</h4>
2495
2496   <p><i>This section is non-normative.</i></p>
2497
2498   <p>When HTML is used to create interactive sites, care needs to be taken to avoid introducing
2499   vulnerabilities through which attackers can compromise the integrity of the site itself or of the
2500   site's users.</p>
2501
2502   <p>A comprehensive study of this matter is beyond the scope of this document, and authors are
2503   strongly encouraged to study the matter in more detail. However, this section attempts to provide
2504   a quick introduction to some common pitfalls in HTML application development.</p>
2505
2506   <p>The security model of the Web is based on the concept of "origins", and correspondingly many of
2507   the potential attacks on the Web involve cross-origin actions. <a href=#refsORIGIN>[ORIGIN]</a></p>
2508
2509   <dl><dt>Not validating user input</dt>
2510    <dt>Cross-site scripting (XSS)</dt>
2511    <dt>SQL injection</dt>
2512
2513    <dd>
2514
2515     <p>When accepting untrusted input, e.g. user-generated content such as text comments, values in
2516     URL parameters, messages from third-party sites, etc, it is imperative that the data be
2517     validated before use, and properly escaped when displayed. Failing to do this can allow a
2518     hostile user to perform a variety of attacks, ranging from the potentially benign, such as
2519     providing bogus user information like a negative age, to the serious, such as running scripts
2520     every time a user looks at a page that includes the information, potentially propagating the
2521     attack in the process, to the catastrophic, such as deleting all data in the server.</p>
2522
2523     <p>When writing filters to validate user input, it is imperative that filters always be
2524     whitelist-based, allowing known-safe constructs and disallowing all other input. Blacklist-based
2525     filters that disallow known-bad inputs and allow everything else are not secure, as not
2526     everything that is bad is yet known (for example, because it might be invented in the
2527     future).</p>
2528
2529     <div class=example>
2530
2531      <p>For example, suppose a page looked at its URL's query string to determine what to display,
2532      and the site then redirected the user to that page to display a message, as in:</p>
2533
2534      <pre>&lt;ul&gt;
2535  &lt;li&gt;&lt;a href="message.cgi?say=Hello"&gt;Say Hello&lt;/a&gt;
2536  &lt;li&gt;&lt;a href="message.cgi?say=Welcome"&gt;Say Welcome&lt;/a&gt;
2537  &lt;li&gt;&lt;a href="message.cgi?say=Kittens"&gt;Say Kittens&lt;/a&gt;
2538 &lt;/ul&gt;</pre>
2539
2540      <p>If the message was just displayed to the user without escaping, a hostile attacker could
2541      then craft a URL that contained a script element:</p>
2542
2543      <pre>http://example.com/message.cgi?say=%3Cscript%3Ealert%28%27Oh%20no%21%27%29%3C/script%3E</pre>
2544
2545      <p>If the attacker then convinced a victim user to visit this page, a script of the attacker's
2546      choosing would run on the page. Such a script could do any number of hostile actions, limited
2547      only by what the site offers: if the site is an e-commerce shop, for instance, such a script
2548      could cause the user to unknowingly make arbitrarily many unwanted purchases.</p>
2549
2550      <p>This is called a cross-site scripting attack.</p>
2551
2552     </div>
2553
2554     <p>There are many constructs that can be used to try to trick a site into executing code. Here
2555     are some that authors are encouraged to consider when writing whitelist filters:</p>
2556
2557     <ul><li>When allowing harmless-seeming elements like <code><a href=#the-img-element>img</a></code>, it is important to whitelist
2558      any provided attributes as well. If one allowed all attributes then an attacker could, for
2559      instance, use the <code title=handler-onload><a href=#handler-onload>onload</a></code> attribute to run arbitrary
2560      script.</li>
2561
2562      <li>When allowing URLs to be provided (e.g. for links), the scheme of each URL also needs to be
2563      explicitly whitelisted, as there are many schemes that can be abused. The most prominent
2564      example is "<code title=javascript-protocol>javascript:</code>", but user agents can
2565      implement (and indeed, have historically implemented) others.</li> <!-- IE had vbscript:,
2566      Netscape had livescript:, etc. -->
2567
2568      <li>Allowing a <code><a href=#the-base-element>base</a></code> element to be inserted means any <code><a href=#the-script-element>script</a></code> elements
2569      in the page with relative links can be hijacked, and similarly that any form submissions can
2570      get redirected to a hostile site.</li>
2571
2572     </ul></dd>
2573
2574
2575    <dt>Cross-site request forgery (CSRF)</dt>
2576
2577    <dd>
2578
2579     <p>If a site allows a user to make form submissions with user-specific side-effects, for example
2580     posting messages on a forum under the user's name, making purchases, or applying for a passport,
2581     it is important to verify that the request was made by the user intentionally, rather than by
2582     another site tricking the user into making the request unknowingly.</p>
2583
2584     <p>This problem exists because HTML forms can be submitted to other origins.</p>
2585
2586     <p>Sites can prevent such attacks by populating forms with user-specific hidden tokens, or by
2587     checking <code title=http-origin>Origin</code> headers on all requests.</p>
2588
2589    </dd>
2590
2591
2592
2593    <dt>Clickjacking</dt>
2594
2595    <dd>
2596
2597     <p>A page that provides users with an interface to perform actions that the user might not wish
2598     to perform needs to be designed so as to avoid the possibility that users can be tricked into
2599     activating the interface.</p>
2600
2601     <p>One way that a user could be so tricked is if a hostile site places the victim site in a
2602     small <code><a href=#the-iframe-element>iframe</a></code> and then convinces the user to click, for instance by having the user
2603     play a reaction game. Once the user is playing the game, the hostile site can quickly position
2604     the iframe under the mouse cursor just as the user is about to click, thus tricking the user
2605     into clicking the victim site's interface.</p>
2606
2607     <p>To avoid this, sites that do not expect to be used in frames are encouraged to only enable
2608     their interface if they detect that they are not in a frame (e.g. by comparing the <code title=dom-window><a href=#dom-window>window</a></code> object to the value of the <code title=dom-top><a href=#dom-top>top</a></code>
2609     attribute).</p>
2610
2611    </dd>
2612
2613   </dl><!--REMOVE-TOPIC:Security--><h4 id=common-pitfalls-to-avoid-when-using-the-scripting-apis><span class=secno>1.11.2 </span>Common pitfalls to avoid when using the scripting APIs</h4>
2614
2615   <p><i>This section is non-normative.</i></p>
2616
2617   <p>Scripts in HTML have "run-to-completion" semantics, meaning that the browser will generally run
2618   the script uninterrupted before doing anything else, such as firing further events or continuing
2619   to parse the document.</p>
2620
2621   <p>On the other hand, parsing of HTML files happens asynchronously and incrementally, meaning that
2622   the parser can pause at any point to let scripts run. This is generally a good thing, but it does
2623   mean that authors need to be careful to avoid hooking event handlers after the events could have
2624   possibly fired.</p>
2625
2626   <p>There are two techniques for doing this reliably: use <a href=#event-handler-content-attributes>event handler content
2627   attributes</a>, or create the element and add the event handlers in the same script. The latter
2628   is safe because, as mentioned earlier, scripts are run to completion before further events can
2629   fire.</p>
2630
2631   <div class=example>
2632
2633    <p>One way this could manifest itself is with <code><a href=#the-img-element>img</a></code> elements and the <code title=event-load>load</code> event. The event could fire as soon as the element has been
2634    parsed, especially if the image has already been cached (which is common).</p>
2635
2636    <p>Here, the author uses the <code title=handler-onload><a href=#handler-onload>onload</a></code> handler on an
2637    <code><a href=#the-img-element>img</a></code> element to catch the <code title=event-load>load</code> event:</p>
2638
2639    <pre>&lt;img src="games.png" alt="Games" onload="gamesLogoHasLoaded(event)"&gt;</pre>
2640
2641    <p>If the element is being added by script, then so long as the event handlers are added in the
2642    same script, the event will still not be missed:</p>
2643
2644    <pre>&lt;script&gt;
2645  var img = new Image();
2646  img.src = 'games.png';
2647  img.alt = 'Games';
2648  img.onload = gamesLogoHasLoaded;
2649  // img.addEventListener('load', gamesLogoHasLoaded, false); // would work also
2650 &lt;/script&gt;</pre>
2651
2652    <p>However, if the author first created the <code><a href=#the-img-element>img</a></code> element and then in a separate
2653    script added the event listeners, there's a chance that the <code title=event-load>load</code>
2654    event would be fired in between, leading it to be missed:</p>
2655
2656    <pre class=bad>&lt;!-- Do not use this style, it has a race condition! --&gt;
2657  &lt;img id="games" src="games.png" alt="Games"&gt;
2658  &lt;!-- the 'load' event might fire here while the parser is taking a
2659       break, in which case you will not see it! --&gt;
2660  &lt;script&gt;
2661   var img = document.getElementById('games');
2662   img.onload = gamesLogoHasLoaded; // might never fire!
2663  &lt;/script&gt;</pre>
2664
2665   </div>
2666
2667
2668
2669   <h3 id=conformance-requirements-for-authors><span class=secno>1.12 </span>Conformance requirements for authors</h3>
2670
2671   <p><i>This section is non-normative.</i></p>
2672
2673   <p>Unlike previous versions of the HTML specification, this specification defines in some detail
2674   the required processing for invalid documents as well as valid documents.</p> <!-- This has led to
2675   some questioning the purpose of conformance criteria: if there is no ambiguity in how something
2676   will be processed, why disallow it? -->
2677
2678   <p>However, even though the processing of invalid content is in most cases well-defined,
2679   conformance requirements for documents are still important: in practice, interoperability (the
2680   situation in which all implementations process particular content in a reliable and identical or
2681   equivalent way) is not the only goal of document conformance requirements. This section details
2682   some of the more common reasons for still distinguishing between a conforming document and one
2683   with errors.</p>
2684
2685
2686   <h4 id=presentational-markup><span class=secno>1.12.1 </span>Presentational markup</h4>
2687
2688   <p><i>This section is non-normative.</i></p>
2689
2690   <p>The majority of presentational features from previous versions of HTML are no longer allowed.
2691   Presentational markup in general has been found to have a number of problems:</p>
2692
2693   <dl><dt>The use of presentational elements leads to poorer accessibility</dt>
2694
2695    <dd>
2696
2697     <p>While it is possible to use presentational markup in a way that provides users of assistive
2698     technologies (ATs) with an acceptable experience (e.g. using ARIA), doing so is significantly
2699     more difficult than doing so when using semantically-appropriate markup. Furthermore, even using
2700     such techniques doesn't help make pages accessible for non-AT non-graphical users, such as users
2701     of text-mode browsers.</p>
2702
2703     <p>Using media-independent markup, on the other hand, provides an easy way for documents to be
2704     authored in such a way that they work for more users (e.g. text browsers).</p>
2705
2706    </dd>
2707
2708
2709    <dt>Higher cost of maintenance</dt>
2710
2711    <dd>
2712
2713     <p>It is significantly easier to maintain a site written in such a way that the markup is
2714     style-independent. For example, changing the color of a site that uses
2715     <code>&lt;font&nbsp;color=""&gt;</code> throughout requires changes across the entire site, whereas
2716     a similar change to a site based on CSS can be done by changing a single file.</p>
2717
2718    </dd>
2719
2720
2721    <dt>Larger document sizes</dt>
2722
2723    <dd>
2724
2725     <p>Presentational markup tends to be much more redundant, and thus results in larger document
2726     sizes.</p>
2727
2728    </dd>
2729
2730   </dl><p>For those reasons, presentational markup has been removed from HTML in this version. This
2731   change should not come as a surprise; HTML4 deprecated presentational markup many years ago and
2732   provided a mode (HTML4 Transitional) to help authors move away from presentational markup; later,
2733   XHTML 1.1 went further and obsoleted those features altogether.</p>
2734
2735   <p>The only remaining presentational markup features in HTML are the <code title=attr-style><a href=#the-style-attribute>style</a></code> attribute and the <code><a href=#the-style-element>style</a></code> element. Use of the <code title=attr-style><a href=#the-style-attribute>style</a></code> attribute is somewhat discouraged in production environments, but
2736   it can be useful for rapid prototyping (where its rules can be directly moved into a separate
2737   style sheet later) and for providing specific styles in unusual cases where a separate style sheet
2738   would be inconvenient. Similarly, the <code><a href=#the-style-element>style</a></code> element can be useful in syndication or
2739   for page-specific styles, but in general an external style sheet is likely to be more convenient
2740   when the styles apply to multiple pages.</p>
2741
2742   <p>It is also worth noting that some elements that were previously presentational have been
2743   redefined in this specification to be media-independent: <code><a href=#the-b-element>b</a></code>, <code><a href=#the-i-element>i</a></code>,
2744   <code><a href=#the-hr-element>hr</a></code>, <code><a href=#the-s-element>s</a></code>, <code><a href=#the-small-element>small</a></code>, and <code><a href=#the-u-element>u</a></code>.</p>
2745
2746
2747   <h4 id=syntax-errors><span class=secno>1.12.2 </span>Syntax errors</h4>
2748
2749   <p><i>This section is non-normative.</i></p>
2750
2751   <p>The syntax of HTML is constrained to avoid a wide variety of problems.</p>
2752
2753   <dl><dt>Unintuitive error-handling behavior</dt>
2754
2755    <dd>
2756
2757     <p>Certain invalid syntax constructs, when parsed, result in DOM trees that are highly
2758     unintuitive.</p>
2759
2760     <div class=example>
2761
2762      <p>For example, the following markup fragment results in a DOM with an <code><a href=#the-hr-element>hr</a></code> element
2763      that is an <em>earlier</em> sibling of the corresponding <code><a href=#the-table-element>table</a></code> element:</p>
2764
2765      <pre class=bad>&lt;table&gt;&lt;hr&gt;...</pre>
2766
2767     </div>
2768
2769    </dd>
2770
2771
2772    <dt>Errors with optional error recovery</dt>
2773
2774    <dd>
2775
2776     <p>To allow user agents to be used in controlled environments without having to implement the
2777     more bizarre and convoluted error handling rules, user agents are permitted to fail whenever
2778     encountering a <a href=#parse-error>parse error</a>.</p>
2779
2780    </dd>
2781
2782
2783    <dt>Errors where the error-handling behavior is not compatible with streaming user agents</dt>
2784
2785    <dd>
2786
2787     <p>Some error-handling behavior, such as the behavior for the <code title="">&lt;table&gt;&lt;hr&gt;...</code> example mentioned above, are incompatible with streaming
2788     user agents (user agents that process HTML files in one pass, without storing state). To avoid
2789     interoperability problems with such user agents, any syntax resulting in such behavior is
2790     considered invalid.</p>
2791
2792    </dd>
2793
2794
2795    <dt>Errors that can result in infoset coercion</dt>
2796
2797    <dd>
2798
2799     <p>When a user agent based on XML is connected to an HTML parser, it is possible that certain
2800     invariants that XML enforces, such as comments never containing two consecutive hyphens, will be
2801     violated by an HTML file. Handling this can require that the parser coerce the HTML DOM into an
2802     XML-compatible infoset. Most syntax constructs that require such handling are considered
2803     invalid.</p>
2804
2805    </dd>
2806
2807
2808    <dt>Errors that result in disproportionally poor performance</dt>
2809
2810    <dd>
2811
2812     <p>Certain syntax constructs can result in disproportionally poor performance. To discourage the
2813     use of such constructs, they are typically made non-conforming.</p>
2814
2815     <div class=example>
2816
2817      <p>For example, the following markup results in poor performance, since all the unclosed
2818      <code><a href=#the-i-element>i</a></code> elements have to be reconstructed in each paragraph, resulting in progressively
2819      more elements in each paragraph:</p>
2820
2821      <pre class=bad>&lt;p&gt;&lt;i&gt;He dreamt.
2822 &lt;p&gt;&lt;i&gt;He dreamt that he ate breakfast.
2823 &lt;p&gt;&lt;i&gt;Then lunch.
2824 &lt;p&gt;&lt;i&gt;And finally dinner.</pre>
2825
2826      <p>The resulting DOM for this fragment would be:</p>
2827
2828      <ul class=domTree><li class=t1><code><a href=#the-p-element>p</a></code><ul><li class=t1><code><a href=#the-i-element>i</a></code><ul><li class=t3><code>#text</code>: <span title="">He dreamt.</span></ul></ul><li class=t1><code><a href=#the-p-element>p</a></code><ul><li class=t1><code><a href=#the-i-element>i</a></code><ul><li class=t1><code><a href=#the-i-element>i</a></code><ul><li class=t3><code>#text</code>: <span title="">He dreamt that he ate breakfast.</span></ul></ul></ul><li class=t1><code><a href=#the-p-element>p</a></code><ul><li class=t1><code><a href=#the-i-element>i</a></code><ul><li class=t1><code><a href=#the-i-element>i</a></code><ul><li class=t1><code><a href=#the-i-element>i</a></code><ul><li class=t3><code>#text</code>: <span title="">Then lunch.</span></ul></ul></ul></ul><li class=t1><code><a href=#the-p-element>p</a></code><ul><li class=t1><code><a href=#the-i-element>i</a></code><ul><li class=t1><code><a href=#the-i-element>i</a></code><ul><li class=t1><code><a href=#the-i-element>i</a></code><ul><li class=t1><code><a href=#the-i-element>i</a></code><ul><li class=t3><code>#text</code>: <span title="">And finally dinner.</span></ul></ul></ul></ul></ul></ul></div>
2829
2830    </dd>
2831
2832
2833    <dt>Errors involving fragile syntax constructs</dt>
2834
2835    <dd>
2836
2837     <p>There are syntax constructs that, for historical reasons, are relatively fragile. To help
2838     reduce the number of users who accidentally run into such problems, they are made
2839     non-conforming.</p>
2840
2841     <div class=example>
2842
2843      <p>For example, the parsing of certain named character references in attributes happens even
2844      with the closing semicolon being omitted. It is safe to include an ampersand followed by
2845      letters that do not form a named character reference, but if the letters are changed to a
2846      string that <em>does</em> form a named character reference, they will be interpreted as that
2847      character instead.</p>
2848
2849      <p>In this fragment, the attribute's value is "<code title="">?bill&amp;ted</code>":</p>
2850
2851      <pre class=bad>&lt;a href="?bill&amp;ted"&gt;Bill and Ted&lt;/a&gt;</pre>
2852
2853      <p>In the following fragment, however, the attribute's value is actually "<code title="">?art&copy;</code>", <em>not</em> the intended "<code title="">?art&amp;copy</code>",
2854      because even without the final semicolon, "<code title="">&amp;copy</code>" is handled the same
2855      as "<code title="">&amp;copy;</code>" and thus gets interpreted as "<code title="">&copy;</code>":</p>
2856
2857      <pre class=bad>&lt;a href="?art&amp;copy"&gt;Art and Copy&lt;/a&gt;</pre>
2858
2859      <p>To avoid this problem, all named character references are required to end with a semicolon,
2860      and uses of named character references without a semicolon are flagged as errors.</p>
2861
2862      <p>Thus, the correct way to express the above cases is as
2863      follows:</p>
2864
2865      <pre>&lt;a href="?bill&amp;ted"&gt;Bill and Ted&lt;/a&gt; &lt;!-- &amp;ted is ok, since it's not a named character reference --&gt;</pre>
2866      <pre>&lt;a href="?art&amp;amp;copy"&gt;Art and Copy&lt;/a&gt; &lt;!-- the &amp; has to be escaped, since &amp;copy <em>is</em> a named character reference --&gt;</pre>
2867
2868     </div>
2869
2870    </dd>
2871
2872
2873    <dt>Errors involving known interoperability problems in legacy user agents</dt>
2874
2875    <dd>
2876
2877     <p>Certain syntax constructs are known to cause especially subtle or serious problems in legacy
2878     user agents, and are therefore marked as non-conforming to help authors avoid them.</p>
2879
2880     <div class=example>
2881
2882      <p>For example, this is why the U+0060 GRAVE ACCENT character (`) is not allowed in unquoted
2883      attributes. In certain legacy user agents, <!-- namely IE --> it is sometimes treated as a
2884      quote character.</p>
2885
2886     </div>
2887
2888     <div class=example>
2889
2890      <p>Another example of this is the DOCTYPE, which is required to trigger <a href=#no-quirks-mode>no-quirks
2891      mode</a>, because the behavior of legacy user agents in <a href=#quirks-mode>quirks mode</a> is often
2892      largely undocumented.</p>
2893
2894     </div>
2895
2896    </dd>
2897
2898
2899 <!--ADD-TOPIC:Security-->
2900    <dt>Errors that risk exposing authors to security attacks</dt>
2901
2902    <dd>
2903
2904     <p>Certain restrictions exist purely to avoid known security problems.</p>
2905
2906     <div class=example>
2907
2908      <p>For example, the restriction on using UTF-7 exists purely to avoid authors falling prey to a
2909      known cross-site-scripting attack using UTF-7. <a href=#refsUTF7>[UTF7]</a></p>
2910
2911     </div>
2912
2913    </dd>
2914 <!--REMOVE-TOPIC:Security-->
2915
2916
2917    <dt>Cases where the author's intent is unclear</dt>
2918
2919    <dd>
2920
2921     <p>Markup where the author's intent is very unclear is often made non-conforming. Correcting
2922     these errors early makes later maintenance easier.</p>
2923
2924     <div class=example>
2925
2926      <p>For example, it is unclear whether the author intended the following to be an
2927      <code><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements>h1</a></code> heading or an <code><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements>h2</a></code> heading:</p>
2928
2929      <pre class=bad>&lt;h1&gt;Contact details&lt;/h2&gt;</pre>
2930
2931     </div>
2932
2933    </dd>
2934
2935
2936    <dt>Cases that are likely to be typos</dt>
2937
2938    <dd>
2939
2940     <p>When a user makes a simple typo, it is helpful if the error can be caught early, as this can
2941     save the author a lot of debugging time. This specification therefore usually considers it an
2942     error to use element names, attribute names, and so forth, that do not match the names defined
2943     in this specification.</p>
2944
2945     <div class=example>
2946
2947      <p>For example, if the author typed <code>&lt;capton&gt;</code> instead of
2948      <code>&lt;caption&gt;</code>, this would be flagged as an error and the author could correct the
2949      typo immediately.</p>
2950
2951     </div>
2952
2953    </dd>
2954
2955
2956    <dt>Errors that could interfere with new syntax in the future</dt>
2957
2958    <dd>
2959
2960     <p>In order to allow the language syntax to be extended in the future, certain otherwise
2961     harmless features are disallowed.</p>
2962
2963     <div class=example>
2964
2965      <p>For example, "attributes" in end tags are ignored currently, but they are invalid, in case a
2966      future change to the language makes use of that syntax feature without conflicting with
2967      already-deployed (and valid!) content.</p>
2968
2969     </div>
2970
2971    </dd>
2972
2973
2974   </dl><p>Some authors find it helpful to be in the practice of always quoting all attributes and always
2975   including all optional tags, preferring the consistency derived from such custom over the minor
2976   benefits of terseness afforded by making use of the flexibility of the HTML syntax. To aid such
2977   authors, conformance checkers can provide modes of operation wherein such conventions are
2978   enforced.</p>
2979
2980
2981
2982   <h4 id=restrictions-on-content-models-and-on-attribute-values><span class=secno>1.12.3 </span>Restrictions on content models and on attribute values</h4>
2983
2984   <p><i>This section is non-normative.</i></p>
2985
2986   <p>Beyond the syntax of the language, this specification also places restrictions on how elements
2987   and attributes can be specified. These restrictions are present for similar reasons:</p>
2988
2989   <dl><dt>Errors involving content with dubious semantics</dt>
2990
2991    <dd>
2992
2993     <p>To avoid misuse of elements with defined meanings, content models are defined that restrict
2994     how elements can be nested when such nestings would be of dubious value.</p>
2995
2996     <p class=example>For example, this specification disallows nesting a <code><a href=#the-section-element>section</a></code>
2997     element inside a <code><a href=#the-kbd-element>kbd</a></code> element, since it is highly unlikely for an author to indicate
2998     that an entire section should be keyed in.</p>
2999
3000    </dd>
3001
3002
3003    <dt>Errors that involve a conflict in expressed semantics</dt>
3004
3005    <dd>
3006
3007     <p>Similarly, to draw the author's attention to mistakes in the use of elements, clear
3008     contradictions in the semantics expressed are also considered conformance errors.</p>
3009
3010     <div class=example>
3011
3012      <p>In the fragments below, for example, the semantics are nonsensical: a separator cannot
3013      simultaneously be a cell, nor can a radio button be a progress bar.</p>
3014
3015      <pre class=bad>&lt;hr role="cell"&gt;</pre>
3016      <pre class=bad>&lt;input type=radio role=progressbar&gt;</pre>
3017
3018     </div>
3019
3020     <p class=example>Another example is the restrictions on the content models of the
3021     <code><a href=#the-ul-element>ul</a></code> element, which only allows <code><a href=#the-li-element>li</a></code> element children. Lists by definition
3022     consist just of zero or more list items, so if a <code><a href=#the-ul-element>ul</a></code> element contains something
3023     other than an <code><a href=#the-li-element>li</a></code> element, it's not clear what was meant.</p>
3024
3025    </dd>
3026
3027
3028    <dt>Cases where the default styles are likely to lead to confusion</dt>
3029
3030    <dd>
3031
3032     <p>Certain elements have default styles or behaviors that make certain combinations likely to
3033     lead to confusion. Where these have equivalent alternatives without this problem, the confusing
3034     combinations are disallowed.</p>
3035
3036     <p class=example>For example, <code><a href=#the-div-element>div</a></code> elements are rendered as block boxes, and
3037     <code><a href=#the-span-element>span</a></code> elements as inline boxes. Putting a block box in an inline box is
3038     unnecessarily confusing; since either nesting just <code><a href=#the-div-element>div</a></code> elements, or nesting just
3039     <code><a href=#the-span-element>span</a></code> elements, or nesting <code><a href=#the-span-element>span</a></code> elements inside <code><a href=#the-div-element>div</a></code>
3040     elements all serve the same purpose as nesting a <code><a href=#the-div-element>div</a></code> element in a <code><a href=#the-span-element>span</a></code>
3041     element, but only the latter involves a block box in an inline box, the latter combination is
3042     disallowed.</p>
3043
3044     <p class=example>Another example would be the way <a href=#interactive-content>interactive content</a> cannot be
3045     nested. For example, a <code><a href=#the-button-element>button</a></code> element cannot contain a <code><a href=#the-textarea-element>textarea</a></code>
3046     element. This is because the default behavior of such nesting interactive elements would be
3047     highly confusing to users. Instead of nesting these elements, they can be placed side by
3048     side.</p>
3049
3050    </dd>
3051
3052
3053    <dt>Errors that indicate a likely misunderstanding of the specification</dt>
3054
3055    <dd>
3056
3057     <p>Sometimes, something is disallowed because allowing it would likely cause author
3058     confusion.</p>
3059
3060     <p class=example>For example, setting the <code title=attr-fe-disabled><a href=#attr-fe-disabled>disabled</a></code>
3061     attribute to the value "<code title="">false</code>" is disallowed, because despite the
3062     appearance of meaning that the element is enabled, it in fact means that the element is
3063     <em>disabled</em> (what matters for implementations is the presence of the attribute, not its
3064     value).</p>
3065
3066    </dd>
3067
3068
3069    <dt>Errors involving limits that have been imposed merely to simplify the language</dt>
3070
3071    <dd>
3072
3073     <p>Some conformance errors simplify the language that authors need to learn.</p>
3074
3075     <p class=example>For example, the <code><a href=#the-area-element>area</a></code> element's <code title=attr-area-shape><a href=#attr-area-shape>shape</a></code> attribute, despite accepting both <code title=attr-area-shape-keyword-circ><a href=#attr-area-shape-keyword-circ>circ</a></code> and <code title=attr-area-shape-keyword-circle><a href=#attr-area-shape-keyword-circle>circle</a></code> values in practice as synonyms, disallows
3076     the use of the <code title=attr-area-shape-keyword-circ><a href=#attr-area-shape-keyword-circ>circ</a></code> value, so as to simplify
3077     tutorials and other learning aids. There would be no benefit to allowing both, but it would
3078     cause extra confusion when teaching the language.</p>
3079
3080    </dd>
3081
3082
3083    <dt>Errors that involve peculiarities of the parser</dt>
3084
3085    <dd>
3086
3087     <p>Certain elements are parsed in somewhat eccentric ways (typically for historical reasons),
3088     and their content model restrictions are intended to avoid exposing the author to these
3089     issues.</p>
3090
3091     <div class=example>
3092
3093      <p>For example, a <code><a href=#the-form-element>form</a></code> element isn't allowed inside <a href=#phrasing-content>phrasing content</a>,
3094      because when parsed as HTML, a <code><a href=#the-form-element>form</a></code> element's start tag will imply a
3095      <code><a href=#the-p-element>p</a></code> element's end tag. Thus, the following markup results in two <a href=#paragraph title=paragraph>paragraphs</a>, not one:</p>
3096
3097      <pre>&lt;p&gt;Welcome. &lt;form&gt;&lt;label&gt;Name:&lt;/label&gt; &lt;input&gt;&lt;/form&gt;</pre>
3098
3099      <p>It is parsed exactly like the following:</p>
3100
3101      <pre>&lt;p&gt;Welcome. &lt;/p&gt;&lt;form&gt;&lt;label&gt;Name:&lt;/label&gt; &lt;input&gt;&lt;/form&gt;</pre>
3102
3103     </div>
3104
3105    </dd>
3106
3107
3108    <dt>Errors that would likely result in scripts failing in hard-to-debug ways</dt>
3109
3110    <dd>
3111
3112     <p>Some errors are intended to help prevent script problems that would be hard to debug.</p>
3113
3114     <p class=example>This is why, for instance, it is non-conforming to have two <code title=attr-id><a href=#the-id-attribute>id</a></code> attributes with the same value. Duplicate IDs lead to the wrong
3115     element being selected, with sometimes disastrous effects whose cause is hard to determine.</p>
3116
3117    </dd>
3118
3119
3120    <dt>Errors that waste authoring time</dt>
3121
3122    <dd>
3123
3124     <p>Some constructs are disallowed because historically they have been the cause of a lot of
3125     wasted authoring time, and by encouraging authors to avoid making them, authors can save time in
3126     future efforts.</p>
3127
3128     <p class=example>For example, a <code><a href=#the-script-element>script</a></code> element's <code title=attr-script-src><a href=#attr-script-src>src</a></code> attribute causes the element's contents to be ignored.
3129     However, this isn't obvious, especially if the element's contents appear to be executable script
3130     &mdash; which can lead to authors spending a lot of time trying to debug the inline script
3131     without realizing that it is not executing. To reduce this problem, this specification makes it
3132     non-conforming to have executable script in a <code><a href=#the-script-element>script</a></code> element when the <code title=attr-script-src><a href=#attr-script-src>src</a></code> attribute is present. This means that authors who are
3133     validating their documents are less likely to waste time with this kind of mistake.</p>
3134
3135    </dd>
3136
3137
3138    <dt>Errors that involve areas that affect authors migrating to and from XHTML</dt>
3139
3140    <dd>
3141
3142     <p>Some authors like to write files that can be interpreted as both XML and HTML with similar
3143     results. Though this practice is discouraged in general due to the myriad of subtle
3144     complications involved (especially when involving scripting, styling, or any kind of automated
3145     serialization), this specification has a few restrictions intended to at least somewhat mitigate
3146     the difficulties. This makes it easier for authors to use this as a transitionary step when
3147     migrating between HTML and XHTML.</p>
3148
3149     <p class=example>For example, there are somewhat complicated rules surrounding the <code title=attr-lang><a href=#attr-lang>lang</a></code> and <code title=attr-xml-lang><a href=#attr-xml-lang>xml:lang</a></code> attributes
3150     intended to keep the two synchronized.</p>
3151
3152     <p class=example>Another example would be the restrictions on the values of <code title="">xmlns</code> attributes in the HTML serialization, which are intended to ensure that
3153     elements in conforming documents end up in the same namespaces whether processed as HTML or
3154     XML.</p>
3155
3156    </dd>
3157
3158
3159    <dt>Errors that involve areas reserved for future expansion</dt>
3160
3161    <dd>
3162
3163     <p>As with the restrictions on the syntax intended to allow for new syntax in future revisions
3164     of the language, some restrictions on the content models of elements and values of attributes
3165     are intended to allow for future expansion of the HTML vocabulary.</p>
3166
3167     <p class=example>For example, limiting the values of the <code title=attr-hyperlink-target><a href=#attr-hyperlink-target>target</a></code> attribute that start with an U+005F LOW LINE
3168     character (_) to only specific predefined values allows new predefined values to be introduced
3169     at a future time without conflicting with author-defined values.</p>
3170
3171    </dd>
3172
3173
3174    <dt>Errors that indicate a mis-use of other specifications</dt>
3175
3176    <dd>
3177
3178     <p>Certain restrictions are intended to support the restrictions made by other
3179     specifications.</p>
3180
3181     <p class=example>For example, requiring that attributes that take media queries use only
3182     <em>valid</em> media queries reinforces the importance of following the conformance rules of
3183     that specification.</p>
3184
3185    </dd>
3186
3187   </dl><h3 id=suggested-reading><span class=secno>1.13 </span>Suggested reading</h3>
3188
3189   <p><i>This section is non-normative.</i></p>
3190
3191   <p>The following documents might be of interest to readers of this specification.</p>
3192
3193