Annotation of html5/spec/syntax.html, revision 1.1123

1.1042    mike        1: <!DOCTYPE html>
1.1052    mike        2: <html lang="en-US-x-Hixie"><head><title>8 The HTML syntax &#8212; HTML5</title><style type="text/css">
1.1       mike        3:    pre { margin-left: 2em; white-space: pre-wrap; }
                      4:    h2 { margin: 3em 0 1em 0; }
                      5:    h3 { margin: 2.5em 0 1em 0; }
                      6:    h4 { margin: 2.5em 0 0.75em 0; }
                      7:    h5, h6 { margin: 2.5em 0 1em; }
                      8:    h1 + h2, h1 + h2 + h2 { margin: 0.75em 0 0.75em; }
                      9:    h2 + h3, h3 + h4, h4 + h5, h5 + h6 { margin-top: 0.5em; }
                     10:    p { margin: 1em 0; }
                     11:    hr:not(.top) { display: block; background: none; border: none; padding: 0; margin: 2em 0; height: auto; }
                     12:    dl, dd { margin-top: 0; margin-bottom: 0; }
                     13:    dt { margin-top: 0.75em; margin-bottom: 0.25em; clear: left; }
                     14:    dt + dt { margin-top: 0; }
                     15:    dd dt { margin-top: 0.25em; margin-bottom: 0; }
                     16:    dd p { margin-top: 0; }
                     17:    dd dl + p { margin-top: 1em; }
                     18:    dd table + p { margin-top: 1em; }
                     19:    p + * > li, dd li { margin: 1em 0; }
                     20:    dt, dfn { font-weight: bold; font-style: normal; }
1.1045    mike       21:    i, em { font-style: italic; }
1.1       mike       22:    dt dfn { font-style: italic; }
                     23:    pre, code { font-size: inherit; font-family: monospace; font-variant: normal; }
                     24:    pre strong { color: black; font: inherit; font-weight: bold; background: yellow; }
                     25:    pre em { font-weight: bolder; font-style: normal; }
                     26:    @media screen { code { color: orangered; } code :link, code :visited { color: inherit; } }
                     27:    var sub { vertical-align: bottom; font-size: smaller; position: relative; top: 0.1em; }
                     28:    table { border-collapse: collapse; border-style: hidden hidden none hidden; }
1.983     mike       29:    table thead, table tbody { border-bottom: solid; }
1.1       mike       30:    table tbody th:first-child { border-left: solid; }
1.475     mike       31:    table tbody th { text-align: left; }
1.1       mike       32:    table td, table th { border-left: solid; border-right: solid; border-bottom: solid thin; vertical-align: top; padding: 0.2em; }
                     33:    blockquote { margin: 0 0 0 2em; border: 0; padding: 0; font-style: italic; }
                     34: 
                     35:    .bad, .bad *:not(.XXX) { color: gray; border-color: gray; background: transparent; }
                     36:    .matrix, .matrix td { border: none; text-align: right; }
                     37:    .matrix { margin-left: 2em; }
                     38:    .dice-example { border-collapse: collapse; border-style: hidden solid solid hidden; border-width: thin; margin-left: 3em; }
                     39:    .dice-example caption { width: 30em; font-size: smaller; font-style: italic; padding: 0.75em 0; text-align: left; }
                     40:    .dice-example td, .dice-example th { border: solid thin; width: 1.35em; height: 1.05em; text-align: center; padding: 0; }
                     41: 
                     42:    .toc dfn, h1 dfn, h2 dfn, h3 dfn, h4 dfn, h5 dfn, h6 dfn { font: inherit; }
1.1048    mike       43:    img.extra, p.overview { float: right; }
1.1047    mike       44:    pre.idl { border: solid thin; background: #EEEEEE; color: black; padding: 0.5em 1em; position: relative; }
1.1       mike       45:    pre.idl :link, pre.idl :visited { color: inherit; background: transparent; }
1.1047    mike       46:    pre.idl::before { content: "IDL"; font: bold small sans-serif; padding: 0.5em; background: white; position: absolute; top: 0; margin: -1px 0 0 -4em; width: 1.5em; border: thin solid; border-radius: 0 0 0 0.5em }
1.1       mike       47:    pre.css { border: solid thin; background: #FFFFEE; color: black; padding: 0.5em 1em; }
                     48:    pre.css:first-line { color: #AAAA50; }
1.840     mike       49:    dl.domintro { color: green; margin: 2em 0 2em 2em; padding: 0.5em 1em; border: none; background: #DDFFDD; }
1.1       mike       50:    hr + dl.domintro, div.impl + dl.domintro { margin-top: 2.5em; margin-bottom: 1.5em; }
                     51:    dl.domintro dt, dl.domintro dt * { color: black; text-decoration: none; }
                     52:    dl.domintro dd { margin: 0.5em 0 1em 2em; padding: 0; }
                     53:    dl.domintro dd p { margin: 0.5em 0; }
1.1050    mike       54:    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; }
1.1       mike       55:    dl.switch { padding-left: 2em; }
                     56:    dl.switch > dt { text-indent: -1.5em; }
                     57:    dl.switch > dt:before { content: '\21AA'; padding: 0 0.5em 0 0; display: inline-block; width: 1em; text-align: right; line-height: 0.5em; }
                     58:    dl.triple { padding: 0 0 0 1em; }
                     59:    dl.triple dt, dl.triple dd { margin: 0; display: inline }
                     60:    dl.triple dt:after { content: ':'; }
                     61:    dl.triple dd:after { content: '\A'; white-space: pre; }
                     62:    .diff-old { text-decoration: line-through; color: silver; background: transparent; }
                     63:    .diff-chg, .diff-new { text-decoration: underline; color: green; background: transparent; }
                     64:    a .diff-new { border-bottom: 1px blue solid; }
                     65: 
                     66:    h2 { page-break-before: always; }
                     67:    h1, h2, h3, h4, h5, h6 { page-break-after: avoid; }
                     68:    h1 + h2, hr + h2.no-toc { page-break-before: auto; }
                     69: 
1.1016    mike       70:    p  > span:not([title=""]):not([class="XXX"]):not([class="impl"]):not([class="note"]),
                     71:    li > span:not([title=""]):not([class="XXX"]):not([class="impl"]):not([class="note"]), { border-bottom: solid #9999CC; }
1.1       mike       72: 
                     73:    div.head { margin: 0 0 1em; padding: 1em 0 0 0; }
                     74:    div.head p { margin: 0; }
                     75:    div.head h1 { margin: 0; }
                     76:    div.head .logo { float: right; margin: 0 1em; }
                     77:    div.head .logo img { border: none } /* remove border from top image */
                     78:    div.head dl { margin: 1em 0; }
1.671     mike       79:    div.head p.copyright, div.head p.alt { font-size: x-small; font-style: oblique; margin: 0; }
1.1       mike       80: 
                     81:    body > .toc > li { margin-top: 1em; margin-bottom: 1em; }
                     82:    body > .toc.brief > li { margin-top: 0.35em; margin-bottom: 0.35em; }
                     83:    body > .toc > li > * { margin-bottom: 0.5em; }
                     84:    body > .toc > li > * > li > * { margin-bottom: 0.25em; }
                     85:    .toc, .toc li { list-style: none; }
                     86: 
                     87:    .brief { margin-top: 1em; margin-bottom: 1em; line-height: 1.1; }
                     88:    .brief li { margin: 0; padding: 0; }
                     89:    .brief li p { margin: 0; padding: 0; }
                     90: 
                     91:    .category-list { margin-top: -0.75em; margin-bottom: 1em; line-height: 1.5; }
                     92:    .category-list::before { content: '\21D2\A0'; font-size: 1.2em; font-weight: 900; }
                     93:    .category-list li { display: inline; }
                     94:    .category-list li:not(:last-child)::after { content: ', '; }
                     95:    .category-list li > span, .category-list li > a { text-transform: lowercase; }
                     96:    .category-list li * { text-transform: none; } /* don't affect <code> nested in <a> */
                     97: 
                     98:    .XXX { color: #E50000; background: white; border: solid red; padding: 0.5em; margin: 1em 0; }
                     99:    .XXX > :first-child { margin-top: 0; }
                    100:    p .XXX { line-height: 3em; }
1.159     mike      101:    .annotation { border: solid thin black; background: #0C479D; color: white; position: relative; margin: 8px 0 20px 0; }
                    102:    .annotation:before { position: absolute; left: 0; top: 0; width: 100%; height: 100%; margin: 6px -6px -6px 6px; background: #333333; z-index: -1; content: ''; }
                    103:    .annotation :link, .annotation :visited { color: inherit; }
                    104:    .annotation :link:hover, .annotation :visited:hover { background: transparent; }
                    105:    .annotation span { border: none ! important; }
1.1       mike      106:    .note { color: green; background: transparent; font-family: sans-serif; }
                    107:    .warning { color: red; background: transparent; }
                    108:    .note, .warning { font-weight: bolder; font-style: italic; }
1.1045    mike      109:    .note em, .warning em, .note i, .warning i { font-style: normal; }
1.1       mike      110:    p.note, div.note { padding: 0.5em 2em; }
                    111:    span.note { padding: 0 2em; }
                    112:    .note p:first-child, .warning p:first-child { margin-top: 0; }
                    113:    .note p:last-child, .warning p:last-child { margin-bottom: 0; }
                    114:    .warning:before { font-style: normal; }
                    115:    p.note:before { content: 'Note: '; }
                    116:    p.warning:before { content: '\26A0 Warning! '; }
                    117: 
                    118:    .bookkeeping:before { display: block; content: 'Bookkeeping details'; font-weight: bolder; font-style: italic; }
                    119:    .bookkeeping { font-size: 0.8em; margin: 2em 0; }
                    120:    .bookkeeping p { margin: 0.5em 2em; display: list-item; list-style: square; }
1.1006    mike      121:    .bookkeeping dt { margin: 0.5em 2em 0; }
                    122:    .bookkeeping dd { margin: 0 3em 0.5em; }
1.1       mike      123: 
                    124:    h4 { position: relative; z-index: 3; }
                    125:    h4 + .element, h4 + div + .element { margin-top: -2.5em; padding-top: 2em; }
                    126:    .element {
                    127:      background: #EEEEFF;
                    128:      color: black;
                    129:      margin: 0 0 1em 0.15em;
                    130:      padding: 0 1em 0.25em 0.75em;
                    131:      border-left: solid #9999FF 0.25em;
                    132:      position: relative;
                    133:      z-index: 1;
                    134:    }
                    135:    .element:before {
                    136:      position: absolute;
                    137:      z-index: 2;
                    138:      top: 0;
                    139:      left: -1.15em;
                    140:      height: 2em;
                    141:      width: 0.9em;
                    142:      background: #EEEEFF;
                    143:      content: ' ';
                    144:      border-style: none none solid solid;
                    145:      border-color: #9999FF;
                    146:      border-width: 0.25em;
                    147:    }
                    148: 
1.149     mike      149:    .example { display: block; color: #222222; background: #FCFCFC; border-left: double; margin-left: 2em; padding-left: 1em; }
                    150:    td > .example:only-child { margin: 0 0 0 0.1em; }
1.1       mike      151: 
                    152:    ul.domTree, ul.domTree ul { padding: 0 0 0 1em; margin: 0; }
                    153:    ul.domTree li { padding: 0; margin: 0; list-style: none; position: relative; }
                    154:    ul.domTree li li { list-style: none; }
                    155:    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; }
                    156:    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; }
                    157:    ul.domTree span { font-style: italic; font-family: serif; }
                    158:    ul.domTree .t1 code { color: purple; font-weight: bold; }
                    159:    ul.domTree .t2 { font-style: normal; font-family: monospace; }
                    160:    ul.domTree .t2 .name { color: black; font-weight: bold; }
                    161:    ul.domTree .t2 .value { color: blue; font-weight: normal; }
                    162:    ul.domTree .t3 code, .domTree .t4 code, .domTree .t5 code { color: gray; }
                    163:    ul.domTree .t7 code, .domTree .t8 code { color: green; }
                    164:    ul.domTree .t10 code { color: teal; }
                    165: 
1.736     mike      166:    body.dfnEnabled dfn { cursor: pointer; }
                    167:    .dfnPanel {
                    168:      display: inline;
                    169:      position: absolute;
                    170:      z-index: 10;
                    171:      height: auto;
                    172:      width: auto;
                    173:      padding: 0.5em 0.75em;
                    174:      font: small sans-serif, Droid Sans Fallback;
                    175:      background: #DDDDDD;
                    176:      color: black;
                    177:      border: outset 0.2em;
                    178:    }
                    179:    .dfnPanel * { margin: 0; padding: 0; font: inherit; text-indent: 0; }
                    180:    .dfnPanel :link, .dfnPanel :visited { color: black; }
                    181:    .dfnPanel p { font-weight: bolder; }
                    182:    .dfnPanel * + p { margin-top: 0.25em; }
                    183:    .dfnPanel li { list-style-position: inside; }
                    184: 
1.671     mike      185:    #configUI { position: absolute; z-index: 20; top: 10em; right: 1em; width: 11em; font-size: small; }
                    186:    #configUI p { margin: 0.5em 0; padding: 0.3em; background: #EEEEEE; color: black; border: inset thin; }
                    187:    #configUI p label { display: block; }
                    188:    #configUI #updateUI, #configUI .loginUI { text-align: center; }
                    189:    #configUI input[type=button] { display: block; margin: auto; }
1.1002    mike      190: 
1.1021    mike      191:    fieldset { margin: 1em; padding: 0.5em 1em; }
                    192:    fieldset > legend + * { margin-top: 0; }
1.1013    mike      193:    fieldset > :last-child { margin-bottom: 0; }
1.1021    mike      194:    fieldset p { margin: 0.5em 0; }
                    195: 
1.1043    mike      196:   </style><link href="http://www.w3.org/StyleSheets/TR/W3C-ED" rel="stylesheet" type="text/css"><style type="text/css">
1.267     mike      197: 
1.292     mike      198:    .applies thead th > * { display: block; }
                    199:    .applies thead code { display: block; }
                    200:    .applies tbody th { whitespace: nowrap; }
                    201:    .applies td { text-align: center; }
                    202:    .applies .yes { background: yellow; }
                    203: 
1.1007    mike      204:    .matrix, .matrix td { border: hidden; text-align: right; }
1.267     mike      205:    .matrix { margin-left: 2em; }
                    206: 
                    207:    .dice-example { border-collapse: collapse; border-style: hidden solid solid hidden; border-width: thin; margin-left: 3em; }
                    208:    .dice-example caption { width: 30em; font-size: smaller; font-style: italic; padding: 0.75em 0; text-align: left; }
                    209:    .dice-example td, .dice-example th { border: solid thin; width: 1.35em; height: 1.05em; text-align: center; padding: 0; }
                    210: 
1.1009    mike      211:    td.eg { border-width: thin; text-align: center; }
                    212: 
1.267     mike      213:    #table-example-1 { border: solid thin; border-collapse: collapse; margin-left: 3em; }
                    214:    #table-example-1 * { font-family: "Essays1743", serif; line-height: 1.01em; }
                    215:    #table-example-1 caption { padding-bottom: 0.5em; }
                    216:    #table-example-1 thead, #table-example-1 tbody { border: none; }
                    217:    #table-example-1 th, #table-example-1 td { border: solid thin; }
                    218:    #table-example-1 th { font-weight: normal; }
                    219:    #table-example-1 td { border-style: none solid; vertical-align: top; }
                    220:    #table-example-1 th { padding: 0.5em; vertical-align: middle; text-align: center; }
                    221:    #table-example-1 tbody tr:first-child td { padding-top: 0.5em; }
                    222:    #table-example-1 tbody tr:last-child td { padding-bottom: 1.5em; }
                    223:    #table-example-1 tbody td:first-child { padding-left: 2.5em; padding-right: 0; width: 9em; }
                    224:    #table-example-1 tbody td:first-child::after { content: leader(". "); }
                    225:    #table-example-1 tbody td { padding-left: 2em; padding-right: 2em; }
                    226:    #table-example-1 tbody td:first-child + td { width: 10em; }
                    227:    #table-example-1 tbody td:first-child + td ~ td { width: 2.5em; }
                    228:    #table-example-1 tbody td:first-child + td + td + td ~ td { width: 1.25em; }
                    229: 
                    230:    .apple-table-examples { border: none; border-collapse: separate; border-spacing: 1.5em 0em; width: 40em; margin-left: 3em; }
                    231:    .apple-table-examples * { font-family: "Times", serif; }
                    232:    .apple-table-examples td, .apple-table-examples th { border: none; white-space: nowrap; padding-top: 0; padding-bottom: 0; }
                    233:    .apple-table-examples tbody th:first-child { border-left: none; width: 100%; }
                    234:    .apple-table-examples thead th:first-child ~ th { font-size: smaller; font-weight: bolder; border-bottom: solid 2px; text-align: center; }
                    235:    .apple-table-examples tbody th::after, .apple-table-examples tfoot th::after { content: leader(". ") }
                    236:    .apple-table-examples tbody th, .apple-table-examples tfoot th { font: inherit; text-align: left; }
                    237:    .apple-table-examples td { text-align: right; vertical-align: top; }
                    238:    .apple-table-examples.e1 tbody tr:last-child td { border-bottom: solid 1px; }
                    239:    .apple-table-examples.e1 tbody + tbody tr:last-child td { border-bottom: double 3px; }
                    240:    .apple-table-examples.e2 th[scope=row] { padding-left: 1em; }
                    241:    .apple-table-examples sup { line-height: 0; }
                    242: 
1.724     mike      243:    .details-example img { vertical-align: top; }
                    244: 
1.1028    mike      245:    #base64-table {
                    246:      white-space: nowrap;
                    247:      font-size: 0.6em;
                    248:      column-width: 6em;
                    249:      column-count: 5;
                    250:      column-gap: 1em;
                    251:      -moz-column-width: 6em;
                    252:      -moz-column-count: 5;
                    253:      -moz-column-gap: 1em;
                    254:      -webkit-column-width: 6em;
                    255:      -webkit-column-count: 5;
                    256:      -webkit-column-gap: 1em;
                    257:    }
                    258:    #base64-table thead { display: none; }
                    259:    #base64-table * { border: none; }
                    260:    #base64-table tbody td:first-child:after { content: ':'; }
                    261:    #base64-table tbody td:last-child { text-align: right; }
                    262: 
1.882     mike      263:    #named-character-references-table {
1.1010    mike      264:      white-space: nowrap;
1.882     mike      265:      font-size: 0.6em;
1.1010    mike      266:      column-width: 30em;
1.882     mike      267:      column-gap: 1em;
1.1010    mike      268:      -moz-column-width: 30em;
1.882     mike      269:      -moz-column-gap: 1em;
1.1010    mike      270:      -webkit-column-width: 30em;
1.882     mike      271:      -webkit-column-gap: 1em;
                    272:    }
1.1010    mike      273:    #named-character-references-table > table > tbody > tr > td:first-child + td,
1.882     mike      274:    #named-character-references-table > table > tbody > tr > td:last-child { text-align: center; }
                    275:    #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; }
1.1010    mike      276:    #named-character-references-table > table > tbody > tr#entity-CounterClockwiseContourIntegral > td:first-child { font-size: 0.5em; }
1.882     mike      277: 
1.997     mike      278:    .glyph.control { color: red; }
                    279: 
1.999     mike      280:    @font-face {
                    281:      font-family: 'Essays1743';
                    282:      src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743.ttf');
                    283:    }
                    284:    @font-face {
                    285:      font-family: 'Essays1743';
                    286:      font-weight: bold;
                    287:      src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743-Bold.ttf');
                    288:    }
                    289:    @font-face {
                    290:      font-family: 'Essays1743';
                    291:      font-style: italic;
                    292:      src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743-Italic.ttf');
                    293:    }
                    294:    @font-face {
                    295:      font-family: 'Essays1743';
                    296:      font-style: italic;
                    297:      font-weight: bold;
                    298:      src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743-BoldItalic.ttf');
                    299:    }
                    300: 
1.1042    mike      301:   </style><link href="data:text/css," id="complete" rel="stylesheet" title="Complete specification"><link href="data:text/css,.impl%20%7B%20display:%20none;%20%7D%0Ahtml%20%7B%20border:%20solid%20yellow;%20%7D%20.domintro:before%20%7B%20display:%20none;%20%7D" id="author" rel="alternate stylesheet" title="Author documentation only"><link href="data:text/css,.impl%20%7B%20background:%20%23FFEEEE;%20%7D%20.domintro:before%20%7B%20background:%20%23FFEEEE;%20%7D" id="highlight" rel="alternate stylesheet" title="Highlight implementation requirements"><script type="text/javascript">
1.1033    mike      302:    function getCookie(name) {
                    303:      var params = location.search.substr(1).split("&");
                    304:      for (var index = 0; index < params.length; index++) {
                    305:        if (params[index] == name)
                    306:          return "1";
                    307:        var data = params[index].split("=");
                    308:        if (data[0] == name)
                    309:          return unescape(data[1]);
                    310:      }
                    311:      var cookies = document.cookie.split("; ");
                    312:      for (var index = 0; index < cookies.length; index++) {
                    313:        var data = cookies[index].split("=");
                    314:        if (data[0] == name)
                    315:          return unescape(data[1]);
                    316:      }
                    317:      return null;
                    318:    }
                    319:   </script>
1.996     mike      320:   <script src="link-fixup.js"></script>
1.1052    mike      321:   <link href="dnd.html" title="7.6 Drag and drop" rel="prev">
                    322:   <link href="index.html#contents" title="Table of contents" rel="contents">
1.996     mike      323:   <link href="parsing.html" title="8.2 Parsing HTML documents" rel="next">
1.1073    mike      324:   </head><body onload="fixBrokenLink();" class="split chapter"><div class="head" id="head">
1.1       mike      325:    <p><a href="http://www.w3.org/"><img alt="W3C" height="48" src="http://www.w3.org/Icons/w3c_home" width="72"></a></p>
1.998     mike      326: 
1.183     mike      327:    <h1>HTML5</h1>
1.1123  ! mike      328:    <h2 class="no-num no-toc" id="a-vocabulary-and-associated-apis-for-html-and-xhtml">A vocabulary and associated APIs for HTML and XHTML</h2><p>This is revision 1.5591.</p>
1.1052    mike      329: 
1.1120    mike      330:    <h2 class="no-num no-toc" id="editor-s-draft-15-february-2012">Editor's Draft 15 February 2012</h2>
1.1052    mike      331:    </div><nav class="prev_next">
                    332:    <a href="dnd.html">&#8592; 7.6 Drag and drop</a> &#8211;
                    333:    <a href="index.html#contents">Table of contents</a> &#8211;
                    334:    <a href="parsing.html">8.2 Parsing HTML documents &#8594;</a>
1.996     mike      335:   <ol class="toc"><li><a href="syntax.html#syntax"><span class="secno">8 </span>The HTML syntax</a>
                    336:   <ol><li><a href="syntax.html#writing"><span class="secno">8.1 </span>Writing HTML documents</a>
                    337:     <ol><li><a href="syntax.html#the-doctype"><span class="secno">8.1.1 </span>The DOCTYPE</a></li><li><a href="syntax.html#elements-0"><span class="secno">8.1.2 </span>Elements</a>
                    338:       <ol><li><a href="syntax.html#start-tags"><span class="secno">8.1.2.1 </span>Start tags</a></li><li><a href="syntax.html#end-tags"><span class="secno">8.1.2.2 </span>End tags</a></li><li><a href="syntax.html#attributes-0"><span class="secno">8.1.2.3 </span>Attributes</a></li><li><a href="syntax.html#optional-tags"><span class="secno">8.1.2.4 </span>Optional tags</a></li><li><a href="syntax.html#element-restrictions"><span class="secno">8.1.2.5 </span>Restrictions on content models</a></li><li><a href="syntax.html#cdata-rcdata-restrictions"><span class="secno">8.1.2.6 </span>Restrictions on the contents of raw text and RCDATA elements</a></li></ol></li><li><a href="syntax.html#text-0"><span class="secno">8.1.3 </span>Text</a>
1.1052    mike      339:       <ol><li><a href="syntax.html#newlines"><span class="secno">8.1.3.1 </span>Newlines</a></li></ol></li><li><a href="syntax.html#character-references"><span class="secno">8.1.4 </span>Character references</a></li><li><a href="syntax.html#cdata-sections"><span class="secno">8.1.5 </span>CDATA sections</a></li><li><a href="syntax.html#comments"><span class="secno">8.1.6 </span>Comments</a></li></ol></li></ol></li></ol></nav>
1.1       mike      340: 
1.755     mike      341:   <h2 id="syntax"><span class="secno">8 </span><dfn>The HTML syntax</dfn></h2><p class="note">This section only describes the rules for resources
1.725     mike      342:   labeled with an <a href="infrastructure.html#html-mime-type">HTML MIME type</a>. Rules for XML resources
                    343:   are discussed in the section below entitled "<a href="the-xhtml-syntax.html#the-xhtml-syntax">The XHTML
1.1008    mike      344:   syntax</a>".</p><h3 id="writing"><span class="secno">8.1 </span>Writing HTML documents</h3><div class="impl">
1.1       mike      345: 
                    346:   <p><i>This section only applies to documents, authoring tools, and
                    347:   markup generators. In particular, it does not apply to conformance
                    348:   checkers; conformance checkers must use the requirements given in
                    349:   the next section ("parsing HTML documents").</i></p>
                    350: 
1.123     mike      351:   </div><p>Documents must consist of the following parts, in the given
                    352:   order:</p><ol><li>Optionally, a single U+FEFF BYTE ORDER MARK (BOM) character.</li>
1.1       mike      353: 
                    354:    <li>Any number of <a href="#syntax-comments" title="syntax-comments">comments</a> and
1.996     mike      355:    <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.1       mike      356: 
                    357:    <li>A <a href="#syntax-doctype" title="syntax-doctype">DOCTYPE</a>.
                    358: 
                    359:    </li><li>Any number of <a href="#syntax-comments" title="syntax-comments">comments</a> and
1.996     mike      360:    <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.1       mike      361: 
1.1052    mike      362:    <li>The root element, in the form of an <code><a href="the-html-element.html#the-html-element">html</a></code> <a href="#syntax-elements" title="syntax-elements">element</a>.</li>
1.1       mike      363: 
                    364:    <li>Any number of <a href="#syntax-comments" title="syntax-comments">comments</a> and
1.996     mike      365:    <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.1       mike      366: 
                    367:   </ol><p>The various types of content mentioned above are described in the
1.1052    mike      368:   next few sections.</p><p>In addition, there are some restrictions on how <a href="the-meta-element.html#character-encoding-declaration" title="character encoding declaration">character encoding
1.1       mike      369:   declarations</a> are to be serialized, as discussed in the
1.123     mike      370:   section on that topic.</p><div class="note">
1.1       mike      371: 
1.1052    mike      372:    <p>Space characters before the root <code><a href="the-html-element.html#the-html-element">html</a></code> element, and
                    373:    space characters at the start of the <code><a href="the-html-element.html#the-html-element">html</a></code> element and
                    374:    before the <code><a href="the-head-element.html#the-head-element">head</a></code> element, will be dropped when the
1.1       mike      375:    document is parsed; space characters <em>after</em> the root
1.1052    mike      376:    <code><a href="the-html-element.html#the-html-element">html</a></code> element will be parsed as if they were at the end
                    377:    of the <code><a href="the-body-element.html#the-body-element">body</a></code> element. Thus, space characters around the
1.1       mike      378:    root element do not round-trip.</p>
                    379: 
                    380:    <p>It is suggested that newlines be inserted after the DOCTYPE,
                    381:    after any comments that are before the root element, after the
1.1052    mike      382:    <code><a href="the-html-element.html#the-html-element">html</a></code> element's start tag (if it is not <a href="#syntax-tag-omission" title="syntax-tag-omission">omitted</a>), and after any comments
                    383:    that are inside the <code><a href="the-html-element.html#the-html-element">html</a></code> element but before the
                    384:    <code><a href="the-head-element.html#the-head-element">head</a></code> element.</p>
1.1       mike      385: 
1.123     mike      386:   </div><p>Many strings in the HTML syntax (e.g. the names of elements and
1.1       mike      387:   their attributes) are case-insensitive, but only for characters in
1.547     mike      388:   the ranges U+0041 to U+005A (LATIN CAPITAL LETTER A to LATIN CAPITAL
                    389:   LETTER Z) and U+0061 to U+007A (LATIN SMALL LETTER A to LATIN SMALL
1.1       mike      390:   LETTER Z). For convenience, in this section this is just referred to
1.1034    mike      391:   as "case-insensitive".</p><h4 id="the-doctype"><span class="secno">8.1.1 </span>The DOCTYPE</h4><p>A <dfn id="syntax-doctype" title="syntax-doctype">DOCTYPE</dfn> is a  required preamble.</p><p class="note">DOCTYPEs are required for legacy reasons. When
1.1       mike      392:   omitted, browsers tend to use a different rendering mode that is
                    393:   incompatible with some specifications. Including the DOCTYPE in a
                    394:   document ensures that the browser makes a best-effort attempt at
1.1029    mike      395:   following the relevant specifications.</p><p>A DOCTYPE must consist of the following components, in this
1.882     mike      396:   order:</p><ol class="brief"><li>A string that is an <a href="infrastructure.html#ascii-case-insensitive">ASCII case-insensitive</a> match for the string "<code title="">&lt;!DOCTYPE</code>".</li>
1.996     mike      397:    <li>One or more <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.1011    mike      398:    <li>A string that is an <a href="infrastructure.html#ascii-case-insensitive">ASCII case-insensitive</a> match for the string "<code title="">html</code>".</li>
1.861     mike      399:    <li>Optionally, a <a href="#doctype-legacy-string">DOCTYPE legacy string</a> or an <a href="#obsolete-permitted-doctype-string">obsolete permitted DOCTYPE string</a> (defined below).</li>
1.996     mike      400:    <li>Zero or more <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.588     mike      401:    <li>A U+003E GREATER-THAN SIGN character (&gt;).</li>
1.1011    mike      402:   </ol><p class="note">In other words, <code>&lt;!DOCTYPE html&gt;</code>,
1.861     mike      403:   case-insensitively.</p><hr><p>For the purposes of HTML generators that cannot output HTML
1.1       mike      404:   markup with the short DOCTYPE "<code title="">&lt;!DOCTYPE
1.1011    mike      405:   html&gt;</code>", a <dfn id="doctype-legacy-string">DOCTYPE legacy string</dfn> may be inserted
1.1       mike      406:   into the DOCTYPE (in the position defined above). This string must
1.996     mike      407:   consist of:</p><ol class="brief"><li>One or more <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.1       mike      408:    <li>A string that is an <a href="infrastructure.html#ascii-case-insensitive">ASCII case-insensitive</a> match for the string "<code title="">SYSTEM</code>".</li>
1.996     mike      409:    <li>One or more <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.1       mike      410:    <li>A U+0022 QUOTATION MARK or U+0027 APOSTROPHE character (the <i>quote mark</i>).</li>
1.1047    mike      411:    <li>The literal string "<code><a href="urls.html#about:legacy-compat">about:legacy-compat</a></code>".</li>
1.856     mike      412:    <li>A matching U+0022 QUOTATION MARK or U+0027 APOSTROPHE character (i.e. the same character as in the earlier step labeled <i>quote mark</i>).</li>
1.1011    mike      413:   </ol><p class="note">In other words, <code>&lt;!DOCTYPE html SYSTEM
                    414:   "about:legacy-compat"&gt;</code> or <code>&lt;!DOCTYPE html SYSTEM
1.1004    mike      415:   'about:legacy-compat'&gt;</code>, case-insensitively except for the
                    416:   part in single or double quotes.</p><p>The <a href="#doctype-legacy-string">DOCTYPE legacy string</a> should not be used unless
1.1       mike      417:   the document is generated from a system that cannot output the
1.1034    mike      418:   shorter string.</p><hr><p>To help authors transition from HTML4 and XHTML1, an
1.861     mike      419:   <dfn id="obsolete-permitted-doctype-string">obsolete permitted DOCTYPE string</dfn> can be inserted into
                    420:   the DOCTYPE (in the position defined above). This string must
1.996     mike      421:   consist of:</p><ol class="brief"><li>One or more <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.861     mike      422:    <li>A string that is an <a href="infrastructure.html#ascii-case-insensitive">ASCII case-insensitive</a> match for the string "<code title="">PUBLIC</code>".</li>
1.996     mike      423:    <li>One or more <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.861     mike      424:    <li>A U+0022 QUOTATION MARK or U+0027 APOSTROPHE character (the <i>first quote mark</i>).</li>
                    425:    <li>The string from one of the cells in the first column of the table below. The row to which this cell belongs is the <i>selected row</i>.</li>
                    426:    <li>A matching U+0022 QUOTATION MARK or U+0027 APOSTROPHE character (i.e. the same character as in the earlier step labeled <i>first quote mark</i>).</li>
1.996     mike      427:    <li>If the cell in the second column of the <i>selected row</i> is not blank, one or more <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.861     mike      428:    <li>If the cell in the second column of the <i>selected row</i> is not blank, a U+0022 QUOTATION MARK or U+0027 APOSTROPHE character (the <i>third quote mark</i>).</li>
                    429:    <li>If the cell in the second column of the <i>selected row</i> is not blank, the string from the cell in the second column of the <i>selected row</i>.</li>
                    430:    <li>If the cell in the second column of the <i>selected row</i> is not blank, a matching U+0022 QUOTATION MARK or U+0027 APOSTROPHE character (i.e. the same character as in the earlier step labeled <i>third quote mark</i>).</li>
                    431:   </ol><table><caption>
                    432:     Allowed values for public and system identifiers in an <a href="#obsolete-permitted-doctype-string">obsolete permitted DOCTYPE string</a>.
                    433:    </caption>
                    434:    <thead><tr><th> Public identifier
                    435:      </th><th> System identifier
                    436:    </th></tr></thead><tbody><tr><td> <code title="">-//W3C//DTD&#160;HTML&#160;4.0//EN</code>
                    437:      </td><td>
                    438:     </td></tr><tr><td> <code title="">-//W3C//DTD&#160;HTML&#160;4.0//EN</code>
                    439:      </td><td> <code title="">http://www.w3.org/TR/REC-html40/strict.dtd</code>
                    440:     </td></tr><tr><td> <code title="">-//W3C//DTD&#160;HTML&#160;4.01//EN</code>
                    441:      </td><td>
                    442:     </td></tr><tr><td> <code title="">-//W3C//DTD&#160;HTML&#160;4.01//EN</code>
                    443:      </td><td> <code title="">http://www.w3.org/TR/html4/strict.dtd</code>
                    444:     </td></tr><tr><td> <code title="">-//W3C//DTD&#160;XHTML&#160;1.0&#160;Strict//EN</code>
                    445:      </td><td> <code title="">http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd</code>
                    446:     </td></tr><tr><td> <code title="">-//W3C//DTD&#160;XHTML&#160;1.1//EN</code>
                    447:      </td><td> <code title="">http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd</code>
                    448:   </td></tr></tbody></table><p>A <a href="#syntax-doctype" title="syntax-doctype">DOCTYPE</a> containing an
                    449:   <a href="#obsolete-permitted-doctype-string">obsolete permitted DOCTYPE string</a> is an <dfn id="obsolete-permitted-doctype">obsolete
                    450:   permitted DOCTYPE</dfn>. Authors should not use <a href="#obsolete-permitted-doctype" title="obsolete permitted DOCTYPE">obsolete permitted
1.1008    mike      451:   DOCTYPEs</a>, as they are unnecessarily long.</p><h4 id="elements-0"><span class="secno">8.1.2 </span>Elements</h4><p>There are five different kinds of <dfn id="syntax-elements" title="syntax-elements">elements</dfn>: <a href="#void-elements">void elements</a>,
1.373     mike      452:   <a href="#raw-text-elements">raw text elements</a>, <a href="#rcdata-elements">RCDATA elements</a>,
                    453:   <a href="#foreign-elements">foreign elements</a>, and <a href="#normal-elements">normal elements</a>.</p><dl><dt><dfn id="void-elements">Void elements</dfn></dt>
1.1       mike      454: 
1.1052    mike      455:    <dd><code><a href="the-area-element.html#the-area-element">area</a></code>, <code><a href="the-base-element.html#the-base-element">base</a></code>, <code><a href="the-br-element.html#the-br-element">br</a></code>,
                    456:    <code><a href="the-col-element.html#the-col-element">col</a></code>, <code><a href="the-command-element.html#the-command-element">command</a></code>, <code><a href="the-embed-element.html#the-embed-element">embed</a></code>,
                    457:    <code><a href="the-hr-element.html#the-hr-element">hr</a></code>, <code><a href="the-img-element.html#the-img-element">img</a></code>, <code><a href="the-input-element.html#the-input-element">input</a></code>,
                    458:    <code><a href="the-keygen-element.html#the-keygen-element">keygen</a></code>, <code><a href="the-link-element.html#the-link-element">link</a></code>, <code><a href="the-meta-element.html#the-meta-element">meta</a></code>,
                    459:    <code><a href="the-param-element.html#the-param-element">param</a></code>, <code><a href="the-source-element.html#the-source-element">source</a></code>, <code><a href="the-track-element.html#the-track-element">track</a></code>,
                    460:    <code><a href="the-wbr-element.html#the-wbr-element">wbr</a></code></dd>
1.1034    mike      461:    
1.1       mike      462: 
1.373     mike      463:    <dt><dfn id="raw-text-elements">Raw text elements</dfn></dt>
1.1       mike      464: 
1.1052    mike      465:    <dd><code><a href="the-script-element.html#the-script-element">script</a></code>, <code><a href="the-style-element.html#the-style-element">style</a></code></dd> 
1.1055    mike      466: 
1.373     mike      467:    <dt><dfn id="rcdata-elements">RCDATA elements</dfn></dt>
1.1       mike      468: 
1.1052    mike      469:    <dd><code><a href="the-textarea-element.html#the-textarea-element">textarea</a></code>, <code><a href="the-title-element.html#the-title-element">title</a></code></dd>
1.1       mike      470: 
1.373     mike      471:    <dt><dfn id="foreign-elements">Foreign elements</dfn></dt>
1.1       mike      472: 
1.1047    mike      473:    <dd>Elements from the <a href="namespaces.html#mathml-namespace">MathML namespace</a>
                    474:    and the <a href="namespaces.html#svg-namespace">SVG namespace</a>.</dd>
1.1       mike      475: 
1.373     mike      476:    <dt><dfn id="normal-elements">Normal elements</dfn></dt>
1.1       mike      477: 
                    478:    <dd>All other allowed <a href="infrastructure.html#html-elements">HTML elements</a> are normal
                    479:    elements.</dd>
                    480: 
                    481:   </dl><p><dfn id="syntax-tags" title="syntax-tags">Tags</dfn> are used to delimit the start
1.373     mike      482:   and end of elements in the markup. <a href="#raw-text-elements" title="raw text
                    483:   elements">Raw text</a>, <a href="#rcdata-elements" title="RCDATA
                    484:   elements">RCDATA</a>, and <a href="#normal-elements" title="normal
                    485:   elements">normal</a> elements have a <a href="#syntax-start-tag" title="syntax-start-tag">start tag</a> to indicate where they
                    486:   begin, and an <a href="#syntax-end-tag" title="syntax-end-tag">end tag</a> to
                    487:   indicate where they end. The start and end tags of certain
                    488:   <a href="#normal-elements">normal elements</a> can be <a href="#syntax-tag-omission" title="syntax-tag-omission">omitted</a>, as described
1.1       mike      489:   later. Those that cannot be omitted must not be omitted. <a href="#void-elements">Void
                    490:   elements</a> only have a start tag; end tags must not be
1.373     mike      491:   specified for <a href="#void-elements">void elements</a>. <a href="#foreign-elements">Foreign
                    492:   elements</a> must either have a start tag and an end tag, or a
                    493:   start tag that is marked as self-closing, in which case they must
                    494:   not have an end tag.</p><p>The contents of the element must be placed between just after the
1.1       mike      495:   start tag (which <a href="#syntax-tag-omission" title="syntax-tag-omission">might be implied,
                    496:   in certain cases</a>) and just before the end tag (which again,
                    497:   <a href="#syntax-tag-omission" title="syntax-tag-omission">might be implied in certain
                    498:   cases</a>). The exact allowed contents of each individual element
1.1004    mike      499:   depend on the content model of that element, as described earlier in
                    500:   this specification. Elements must not contain content that their
1.1       mike      501:   content model disallows. In addition to the restrictions placed on
                    502:   the contents by those content models, however, the five types of
1.123     mike      503:   elements have additional <em>syntactic</em> requirements.</p><p><a href="#void-elements">Void elements</a> can't have any contents (since there's
1.1       mike      504:   no end tag, no content can be put between the start tag and the end
1.373     mike      505:   tag).</p><p><a href="#raw-text-elements">Raw text elements</a> can have <a href="#syntax-text" title="syntax-text">text</a>, though it has <a href="#cdata-rcdata-restrictions">restrictions</a> described
                    506:   below.</p><p><a href="#rcdata-elements">RCDATA elements</a> can have <a href="#syntax-text" title="syntax-text">text</a> and <a href="#syntax-charref" title="syntax-charref">character references</a>, but the text
                    507:   must not contain an <a href="#syntax-ambiguous-ampersand" title="syntax-ambiguous-ampersand">ambiguous ampersand</a>.
1.1       mike      508:   There are also <a href="#cdata-rcdata-restrictions">further
1.373     mike      509:   restrictions</a> described below.</p><p><a href="#foreign-elements">Foreign elements</a> whose start tag is marked as
                    510:   self-closing can't have any contents (since, again, as there's no
                    511:   end tag, no content can be put between the start tag and the end
                    512:   tag). <a href="#foreign-elements">Foreign elements</a> whose start tag is <em>not</em>
                    513:   marked as self-closing can have <a href="#syntax-text" title="syntax-text">text</a>, <a href="#syntax-charref" title="syntax-charref">character references</a>, <a href="#syntax-cdata" title="syntax-cdata">CDATA sections</a>, other <a href="#syntax-elements" title="syntax-elements">elements</a>, and <a href="#syntax-comments" title="syntax-comments">comments</a>, but the text must not
1.588     mike      514:   contain the character U+003C LESS-THAN SIGN (&lt;) or an <a href="#syntax-ambiguous-ampersand" title="syntax-ambiguous-ampersand">ambiguous ampersand</a>.</p><div class="note">
1.374     mike      515: 
                    516:    <p>The HTML syntax does not support namespace
                    517:    declarations, even in <a href="#foreign-elements">foreign elements</a>.</p>
                    518: 
                    519:    <p>For instance, consider the following HTML fragment:</p>
                    520: 
                    521:    <pre>&lt;p&gt;
                    522:  &lt;svg&gt;
                    523:   &lt;metadata&gt;
                    524:    &lt;!-- this is invalid --&gt;
                    525:    &lt;cdr:license xmlns:cdr="http://www.example.com/cdr/metadata" name="MIT"/&gt;
                    526:   &lt;/metadata&gt;
                    527:  &lt;/svg&gt;
                    528: &lt;/p&gt;</pre>
                    529: 
                    530:    <p>The innermost element, <code title="">cdr:license</code>, is
                    531:    actually in the SVG namespace, as the "<code title="">xmlns:cdr</code>" attribute has no effect (unlike in
                    532:    XML). In fact, as the comment in the fragment above says, the
                    533:    fragment is actually non-conforming. This is because the SVG
                    534:    specification does not define any elements called "<code title="">cdr:license</code>" in the SVG namespace.</p>
                    535: 
                    536:   </div><p><a href="#normal-elements">Normal elements</a> can have <a href="#syntax-text" title="syntax-text">text</a>, <a href="#syntax-charref" title="syntax-charref">character references</a>, other <a href="#syntax-elements" title="syntax-elements">elements</a>, and <a href="#syntax-comments" title="syntax-comments">comments</a>, but the text must not
1.588     mike      537:   contain the character U+003C LESS-THAN SIGN (&lt;) or an <a href="#syntax-ambiguous-ampersand" title="syntax-ambiguous-ampersand">ambiguous ampersand</a>. Some
                    538:   <a href="#normal-elements">normal elements</a> also have <a href="#element-restrictions">yet more restrictions</a> on what
1.1       mike      539:   content they are allowed to hold, beyond the restrictions imposed by
                    540:   the content model and those described in this paragraph. Those
1.123     mike      541:   restrictions are described below.</p><p>Tags contain a <dfn id="syntax-tag-name" title="syntax-tag-name">tag name</dfn>,
1.1       mike      542:   giving the element's name. HTML elements all have names that only
1.464     mike      543:   use characters in the range U+0030 DIGIT ZERO (0) to U+0039 DIGIT
                    544:   NINE (9), U+0061 LATIN SMALL LETTER A to U+007A LATIN SMALL LETTER
                    545:   Z, and U+0041 LATIN CAPITAL LETTER A to U+005A LATIN CAPITAL LETTER
                    546:   Z. In the HTML syntax, tag names, even those for <a href="#foreign-elements">foreign
1.462     mike      547:   elements</a>, may be written with any mix of lower- and uppercase
                    548:   letters that, when converted to all-lowercase, matches the element's
1.1008    mike      549:   tag name; tag names are case-insensitive.</p><h5 id="start-tags"><span class="secno">8.1.2.1 </span>Start tags</h5><p><dfn id="syntax-start-tag" title="syntax-start-tag">Start tags</dfn> must have the
1.123     mike      550:   following format:</p><ol><li>The first character of a start tag must be a U+003C LESS-THAN
1.588     mike      551:    SIGN character (&lt;).</li>
1.1       mike      552: 
                    553:    <li>The next few characters of a start tag must be the element's
                    554:    <a href="#syntax-tag-name" title="syntax-tag-name">tag name</a>.</li>
                    555: 
                    556:    <li>If there are to be any attributes in the next step, there must
1.996     mike      557:    first be one or more <a href="common-microsyntaxes.html#space-character" title="space character">space
1.1       mike      558:    characters</a>.</li>
                    559: 
                    560:    <li>Then, the start tag may have a number of attributes, the <a href="#syntax-attributes" title="syntax-attributes">syntax for which</a> is described
1.1004    mike      561:    below. Attributes must be separated from each other by one or more
1.996     mike      562:    <a href="common-microsyntaxes.html#space-character" title="space character">space characters</a>.</li>
1.1       mike      563: 
1.766     mike      564:    <li>After the attributes, or after the <a href="#syntax-tag-name" title="syntax-tag-name">tag name</a> if there are no attributes,
1.996     mike      565:    there may be one or more <a href="common-microsyntaxes.html#space-character" title="space character">space
1.766     mike      566:    characters</a>. (Some attributes are required to be followed by
                    567:    a space. See the <a href="#syntax-attributes" title="syntax-attributes">attributes
                    568:    section</a> below.)</li>
1.1       mike      569: 
                    570:    <li>Then, if the element is one of the <a href="#void-elements">void elements</a>,
1.373     mike      571:    or if the element is a <a href="#foreign-elements" title="foreign elements">foreign
1.588     mike      572:    element</a>, then there may be a single U+002F SOLIDUS character
                    573:    (/). This character has no effect on <a href="#void-elements">void elements</a>,
                    574:    but on <a href="#foreign-elements">foreign elements</a> it marks the start tag as
                    575:    self-closing.</li>
1.1       mike      576: 
                    577:    <li>Finally, start tags must be closed by a U+003E GREATER-THAN
1.588     mike      578:    SIGN character (&gt;).</li>
1.1       mike      579: 
1.1008    mike      580:   </ol><h5 id="end-tags"><span class="secno">8.1.2.2 </span>End tags</h5><p><dfn id="syntax-end-tag" title="syntax-end-tag">End tags</dfn> must have the
1.123     mike      581:   following format:</p><ol><li>The first character of an end tag must be a U+003C LESS-THAN
1.588     mike      582:    SIGN character (&lt;).</li>
1.1       mike      583: 
                    584:    <li>The second character of an end tag must be a U+002F SOLIDUS
1.588     mike      585:    character (/).</li>
1.1       mike      586: 
                    587:    <li>The next few characters of an end tag must be the element's
                    588:    <a href="#syntax-tag-name" title="syntax-tag-name">tag name</a>.</li>
                    589: 
1.996     mike      590:    <li>After the tag name, there may be one or more <a href="common-microsyntaxes.html#space-character" title="space
1.1       mike      591:    character">space characters</a>.</li>
                    592: 
1.588     mike      593:    <li>Finally, end tags must be closed by a U+003E GREATER-THAN SIGN
                    594:    character (&gt;).</li>
1.1       mike      595: 
1.1008    mike      596:   </ol><h5 id="attributes-0"><span class="secno">8.1.2.3 </span>Attributes</h5><p><dfn id="syntax-attributes" title="syntax-attributes">Attributes</dfn> for an element
1.123     mike      597:   are expressed inside the element's start tag.</p><p>Attributes have a name and a value. <dfn id="syntax-attribute-name" title="syntax-attribute-name">Attribute names</dfn> must consist of
1.996     mike      598:   one or more characters other than the <a href="common-microsyntaxes.html#space-character" title="space
1.1       mike      599:   character">space characters</a>, U+0000 NULL, U+0022 QUOTATION
                    600:   MARK ("), U+0027 APOSTROPHE ('), U+003E GREATER-THAN SIGN
                    601:   (&gt;), U+002F SOLIDUS (/), and U+003D EQUALS SIGN (=) characters,
                    602:   the control characters, and any characters that are not defined by
1.462     mike      603:   Unicode. In the HTML syntax, attribute names, even those for
                    604:   <a href="#foreign-elements">foreign elements</a>, may be written with any mix of lower-
                    605:   and uppercase letters that are an <a href="infrastructure.html#ascii-case-insensitive">ASCII
1.123     mike      606:   case-insensitive</a> match for the attribute's name.</p><p><dfn id="syntax-attribute-value" title="syntax-attribute-value">Attribute values</dfn> are a
1.1       mike      607:   mixture of <a href="#syntax-text" title="syntax-text">text</a> and <a href="#syntax-charref" title="syntax-charref">character references</a>, except with the
1.123     mike      608:   additional restriction that the text cannot contain an <a href="#syntax-ambiguous-ampersand" title="syntax-ambiguous-ampersand">ambiguous ampersand</a>.</p><p>Attributes can be specified in four different ways:</p><dl><dt>Empty attribute syntax</dt>
1.1       mike      609: 
                    610:    <dd>
                    611: 
                    612:     <p>Just the <a href="#syntax-attribute-name" title="syntax-attribute-name">attribute
1.837     mike      613:     name</a>. The value is implicitly the empty string.</p>
1.1       mike      614: 
                    615:     <div class="example">
                    616: 
1.1052    mike      617:      <p>In the following example, the <code title="attr-fe-disabled"><a href="attributes-common-to-form-controls.html#attr-fe-disabled">disabled</a></code> attribute is given with
1.1       mike      618:      the empty attribute syntax:</p>
                    619: 
                    620:      <pre>&lt;input <em>disabled</em>&gt;</pre>
                    621: 
                    622:     </div>
                    623: 
                    624:     <p>If an attribute using the empty attribute syntax is to be
1.996     mike      625:     followed by another attribute, then there must be a <a href="common-microsyntaxes.html#space-character">space
1.1       mike      626:     character</a> separating the two.</p>
                    627: 
                    628:    </dd>
                    629: 
1.2       mike      630:    <dt id="unquoted">Unquoted attribute value syntax</dt>
1.1       mike      631: 
                    632:    <dd>
                    633: 
                    634:     <p>The <a href="#syntax-attribute-name" title="syntax-attribute-name">attribute name</a>,
1.996     mike      635:     followed by zero or more <a href="common-microsyntaxes.html#space-character" title="space character">space
1.1       mike      636:     characters</a>, followed by a single U+003D EQUALS SIGN
1.996     mike      637:     character, followed by zero or more <a href="common-microsyntaxes.html#space-character" title="space
1.1       mike      638:     character">space characters</a>, followed by the <a href="#syntax-attribute-value" title="syntax-attribute-value">attribute value</a>, which, in
                    639:     addition to the requirements given above for attribute values,
1.996     mike      640:     must not contain any literal <a href="common-microsyntaxes.html#space-character" title="space character">space
1.588     mike      641:     characters</a>, any U+0022 QUOTATION MARK characters ("),
                    642:     U+0027 APOSTROPHE characters ('), U+003D EQUALS SIGN
                    643:     characters (=), U+003C LESS-THAN SIGN characters (&lt;), U+003E
                    644:     GREATER-THAN SIGN characters (&gt;), or U+0060 GRAVE ACCENT
                    645:     characters (`), and must not be the empty string.</p>
1.463     mike      646: 
1.1034    mike      647:     
1.1       mike      648: 
1.1055    mike      649: 
1.1       mike      650:     <div class="example">
                    651: 
1.1047    mike      652:      <p>In the following example, the <code title="attr-input-value"><a href="the-input-element.html#attr-input-value">value</a></code> attribute is given
1.1       mike      653:      with the unquoted attribute value syntax:</p>
                    654: 
                    655:      <pre>&lt;input <em>value=yes</em>&gt;</pre>
                    656: 
                    657:     </div>
                    658: 
                    659:     <p>If an attribute using the unquoted attribute syntax is to be
1.101     mike      660:     followed by another attribute or by the optional U+002F SOLIDUS
1.464     mike      661:     character (/) allowed in step 6 of the <a href="#syntax-start-tag" title="syntax-start-tag">start tag</a> syntax above, then there
1.996     mike      662:     must be a <a href="common-microsyntaxes.html#space-character">space character</a> separating the two.</p>
1.1       mike      663: 
                    664:    </dd>
                    665: 
                    666:    <dt>Single-quoted attribute value syntax</dt>
                    667: 
                    668:    <dd>
                    669: 
                    670:     <p>The <a href="#syntax-attribute-name" title="syntax-attribute-name">attribute name</a>,
1.996     mike      671:     followed by zero or more <a href="common-microsyntaxes.html#space-character" title="space character">space
1.1       mike      672:     characters</a>, followed by a single U+003D EQUALS SIGN
1.996     mike      673:     character, followed by zero or more <a href="common-microsyntaxes.html#space-character" title="space
1.1       mike      674:     character">space characters</a>, followed by a single U+0027
1.588     mike      675:     APOSTROPHE character ('), followed by the <a href="#syntax-attribute-value" title="syntax-attribute-value">attribute value</a>, which, in
1.1       mike      676:     addition to the requirements given above for attribute values,
1.588     mike      677:     must not contain any literal U+0027 APOSTROPHE characters ('), and
                    678:     finally followed by a second single U+0027 APOSTROPHE character
                    679:     (').</p>
1.1       mike      680: 
                    681:     <div class="example">
                    682: 
1.1047    mike      683:      <p>In the following example, the <code title="attr-input-type"><a href="the-input-element.html#attr-input-type">type</a></code> attribute is given with the
1.1       mike      684:      single-quoted attribute value syntax:</p>
                    685: 
                    686:      <pre>&lt;input <em>type='checkbox'</em>&gt;</pre>
                    687: 
                    688:     </div>
                    689: 
                    690:     <p>If an attribute using the single-quoted attribute syntax is to
1.996     mike      691:     be followed by another attribute, then there must be a <a href="common-microsyntaxes.html#space-character">space
1.1       mike      692:     character</a> separating the two.</p>
                    693: 
                    694:    </dd>
                    695: 
                    696:    <dt>Double-quoted attribute value syntax</dt>
                    697: 
                    698:    <dd>
                    699: 
                    700:     <p>The <a href="#syntax-attribute-name" title="syntax-attribute-name">attribute name</a>,
1.996     mike      701:     followed by zero or more <a href="common-microsyntaxes.html#space-character" title="space character">space
1.1       mike      702:     characters</a>, followed by a single U+003D EQUALS SIGN
1.996     mike      703:     character, followed by zero or more <a href="common-microsyntaxes.html#space-character" title="space
1.1       mike      704:     character">space characters</a>, followed by a single U+0022
1.588     mike      705:     QUOTATION MARK character ("), followed by the <a href="#syntax-attribute-value" title="syntax-attribute-value">attribute value</a>, which, in
1.1       mike      706:     addition to the requirements given above for attribute values,
1.588     mike      707:     must not contain any literal U+0022 QUOTATION MARK characters ("),
                    708:     and finally followed by a second single U+0022 QUOTATION MARK
                    709:     character (").</p>
1.1       mike      710: 
                    711:     <div class="example">
                    712: 
1.1052    mike      713:      <p>In the following example, the <code title="attr-fe-name"><a href="attributes-common-to-form-controls.html#attr-fe-name">name</a></code> attribute is given with the
1.1       mike      714:      double-quoted attribute value syntax:</p>
                    715: 
                    716:      <pre>&lt;input <em>name="be evil"</em>&gt;</pre>
                    717: 
                    718:     </div>
                    719: 
                    720:     <p>If an attribute using the double-quoted attribute syntax is to
1.996     mike      721:     be followed by another attribute, then there must be a <a href="common-microsyntaxes.html#space-character">space
1.1       mike      722:     character</a> separating the two.</p>
                    723: 
                    724:    </dd>
                    725: 
                    726:   </dl><p>There must never be two or more attributes on the same start tag
                    727:   whose names are an <a href="infrastructure.html#ascii-case-insensitive">ASCII case-insensitive</a> match for
1.462     mike      728:   each other.</p><hr><p>When a <a href="#foreign-elements" title="foreign elements">foreign element</a> has
                    729:   one of the namespaced attributes given by the local name and
                    730:   namespace of the first and second cells of a row from the following
                    731:   table, it must be written using the name given by the third cell
                    732:   from the same row.</p><table><thead><tr><th> Local name </th><th> Namespace </th><th> Attribute name
1.1047    mike      733:    </th></tr></thead><tbody><tr><td> <code title="">actuate</code> </td><td> <a href="namespaces.html#xlink-namespace">XLink namespace</a> </td><td> <code title="">xlink:actuate</code>
                    734:     </td></tr><tr><td> <code title="">arcrole</code> </td><td> <a href="namespaces.html#xlink-namespace">XLink namespace</a> </td><td> <code title="">xlink:arcrole</code>
                    735:     </td></tr><tr><td> <code title="">href</code> </td><td> <a href="namespaces.html#xlink-namespace">XLink namespace</a> </td><td> <code title="">xlink:href</code>
                    736:     </td></tr><tr><td> <code title="">role</code> </td><td> <a href="namespaces.html#xlink-namespace">XLink namespace</a> </td><td> <code title="">xlink:role</code>
                    737:     </td></tr><tr><td> <code title="">show</code> </td><td> <a href="namespaces.html#xlink-namespace">XLink namespace</a> </td><td> <code title="">xlink:show</code>
                    738:     </td></tr><tr><td> <code title="">title</code> </td><td> <a href="namespaces.html#xlink-namespace">XLink namespace</a> </td><td> <code title="">xlink:title</code>
                    739:     </td></tr><tr><td> <code title="">type</code> </td><td> <a href="namespaces.html#xlink-namespace">XLink namespace</a> </td><td> <code title="">xlink:type</code>
                    740:     </td></tr><tr><td> <code title="">base</code> </td><td> <a href="namespaces.html#xml-namespace">XML namespace</a>  </td><td> <code title="">xml:base</code>
                    741:     </td></tr><tr><td> <code title="">lang</code> </td><td> <a href="namespaces.html#xml-namespace">XML namespace</a> </td><td> <code title="">xml:lang</code>
                    742:     </td></tr><tr><td> <code title="">space</code> </td><td> <a href="namespaces.html#xml-namespace">XML namespace</a> </td><td> <code title="">xml:space</code>
                    743:     </td></tr><tr><td> <code title="">xmlns</code> </td><td> <a href="namespaces.html#xmlns-namespace">XMLNS namespace</a> </td><td> <code title="">xmlns</code>
                    744:     </td></tr><tr><td> <code title="">xlink</code> </td><td> <a href="namespaces.html#xmlns-namespace">XMLNS namespace</a> </td><td> <code title="">xmlns:xlink</code>
1.671     mike      745:   </td></tr></tbody></table><p>No other namespaced attribute can be expressed in <a href="#syntax">the
1.1045    mike      746:   HTML syntax</a>.</p><h5 id="optional-tags"><span class="secno">8.1.2.4 </span>Optional tags</h5><p>Certain tags can be <dfn id="syntax-tag-omission" title="syntax-tag-omission">omitted</dfn>.</p><p class="note">Omitting an element's <a href="#syntax-start-tag" title="syntax-start-tag">start tag</a> in the situations
                    747:   described below does not mean the element is not present; it is
                    748:   implied, but it is still there. For example, an HTML document always
1.1052    mike      749:   has a root <code><a href="the-html-element.html#the-html-element">html</a></code> element, even if the string <code title="">&lt;html&gt;</code> doesn't appear anywhere in the markup.</p><p>An <code><a href="the-html-element.html#the-html-element">html</a></code> element's <a href="#syntax-start-tag" title="syntax-start-tag">start tag</a> may be omitted if the
                    750:   first thing inside the <code><a href="the-html-element.html#the-html-element">html</a></code> element is not a <a href="#syntax-comments" title="syntax-comments">comment</a>.</p><p>An <code><a href="the-html-element.html#the-html-element">html</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    751:   tag</a> may be omitted if the <code><a href="the-html-element.html#the-html-element">html</a></code> element is not
                    752:   immediately followed by a <a href="#syntax-comments" title="syntax-comments">comment</a>.</p><p>A <code><a href="the-head-element.html#the-head-element">head</a></code> element's <a href="#syntax-start-tag" title="syntax-start-tag">start tag</a> may be omitted if the
1.821     mike      753:   element is empty, or if the first thing inside the
1.1052    mike      754:   <code><a href="the-head-element.html#the-head-element">head</a></code> element is an element.</p><p>A <code><a href="the-head-element.html#the-head-element">head</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    755:   tag</a> may be omitted if the <code><a href="the-head-element.html#the-head-element">head</a></code> element is not
                    756:   immediately followed by a <a href="common-microsyntaxes.html#space-character">space character</a> or a <a href="#syntax-comments" title="syntax-comments">comment</a>.</p><p>A <code><a href="the-body-element.html#the-body-element">body</a></code> element's <a href="#syntax-start-tag" title="syntax-start-tag">start tag</a> may be omitted if the
                    757:   element is empty, or if the first thing inside the <code><a href="the-body-element.html#the-body-element">body</a></code>
1.996     mike      758:   element is not a <a href="common-microsyntaxes.html#space-character">space character</a> or a <a href="#syntax-comments" title="syntax-comments">comment</a>, except if the first thing
1.1052    mike      759:   inside the <code><a href="the-body-element.html#the-body-element">body</a></code> element is a <code><a href="the-script-element.html#the-script-element">script</a></code> or
                    760:   <code><a href="the-style-element.html#the-style-element">style</a></code> element. </p><p>A <code><a href="the-body-element.html#the-body-element">body</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    761:   tag</a> may be omitted if the <code><a href="the-body-element.html#the-body-element">body</a></code> element is not
                    762:   immediately followed by a <a href="#syntax-comments" title="syntax-comments">comment</a>.</p><p>An <code><a href="the-li-element.html#the-li-element">li</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    763:   tag</a> may be omitted if the <code><a href="the-li-element.html#the-li-element">li</a></code> element is
                    764:   immediately followed by another <code><a href="the-li-element.html#the-li-element">li</a></code> element or if there
                    765:   is no more content in the parent element.</p><p>A <code><a href="the-dt-element.html#the-dt-element">dt</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    766:   tag</a> may be omitted if the <code><a href="the-dt-element.html#the-dt-element">dt</a></code> element is
                    767:   immediately followed by another <code><a href="the-dt-element.html#the-dt-element">dt</a></code> element or a
                    768:   <code><a href="the-dd-element.html#the-dd-element">dd</a></code> element.</p><p>A <code><a href="the-dd-element.html#the-dd-element">dd</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    769:   tag</a> may be omitted if the <code><a href="the-dd-element.html#the-dd-element">dd</a></code> element is
                    770:   immediately followed by another <code><a href="the-dd-element.html#the-dd-element">dd</a></code> element or a
                    771:   <code><a href="the-dt-element.html#the-dt-element">dt</a></code> element, or if there is no more content in the
                    772:   parent element.</p><p>A <code><a href="the-p-element.html#the-p-element">p</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    773:   tag</a> may be omitted if the <code><a href="the-p-element.html#the-p-element">p</a></code> element is
                    774:   immediately followed by an <code><a href="the-address-element.html#the-address-element">address</a></code>,
                    775:   <code><a href="the-article-element.html#the-article-element">article</a></code>, <code><a href="the-aside-element.html#the-aside-element">aside</a></code>, <code><a href="the-blockquote-element.html#the-blockquote-element">blockquote</a></code>,
                    776:   <code><a href="obsolete.html#dir">dir</a></code>, <code><a href="the-div-element.html#the-div-element">div</a></code>, <code><a href="the-dl-element.html#the-dl-element">dl</a></code>,
                    777:   <code><a href="the-fieldset-element.html#the-fieldset-element">fieldset</a></code>, <code><a href="the-footer-element.html#the-footer-element">footer</a></code>, <code><a href="the-form-element.html#the-form-element">form</a></code>,
                    778:   <code><a href="the-h1-h2-h3-h4-h5-and-h6-elements.html#the-h1-h2-h3-h4-h5-and-h6-elements">h1</a></code>, <code><a href="the-h1-h2-h3-h4-h5-and-h6-elements.html#the-h1-h2-h3-h4-h5-and-h6-elements">h2</a></code>, <code><a href="the-h1-h2-h3-h4-h5-and-h6-elements.html#the-h1-h2-h3-h4-h5-and-h6-elements">h3</a></code>, <code><a href="the-h1-h2-h3-h4-h5-and-h6-elements.html#the-h1-h2-h3-h4-h5-and-h6-elements">h4</a></code>,
                    779:   <code><a href="the-h1-h2-h3-h4-h5-and-h6-elements.html#the-h1-h2-h3-h4-h5-and-h6-elements">h5</a></code>, <code><a href="the-h1-h2-h3-h4-h5-and-h6-elements.html#the-h1-h2-h3-h4-h5-and-h6-elements">h6</a></code>, <code><a href="the-header-element.html#the-header-element">header</a></code>,
                    780:   <code><a href="the-hgroup-element.html#the-hgroup-element">hgroup</a></code>, <code><a href="the-hr-element.html#the-hr-element">hr</a></code>, <code><a href="the-menu-element.html#the-menu-element">menu</a></code>,
                    781:   <code><a href="the-nav-element.html#the-nav-element">nav</a></code>, <code><a href="the-ol-element.html#the-ol-element">ol</a></code>, <code><a href="the-p-element.html#the-p-element">p</a></code>, <code><a href="the-pre-element.html#the-pre-element">pre</a></code>,
                    782:   <code><a href="the-section-element.html#the-section-element">section</a></code>, <code><a href="the-table-element.html#the-table-element">table</a></code>, or <code><a href="the-ul-element.html#the-ul-element">ul</a></code>,
1.1       mike      783:   element, or if there is no more content in the parent element and
1.1052    mike      784:   the parent element is not an <code><a href="the-a-element.html#the-a-element">a</a></code> element.</p><p>An <code><a href="the-rt-element.html#the-rt-element">rt</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    785:   tag</a> may be omitted if the <code><a href="the-rt-element.html#the-rt-element">rt</a></code> element is
                    786:   immediately followed by an <code><a href="the-rt-element.html#the-rt-element">rt</a></code> or <code><a href="the-rp-element.html#the-rp-element">rp</a></code>
                    787:   element, or if there is no more content in the parent element.</p><p>An <code><a href="the-rp-element.html#the-rp-element">rp</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    788:   tag</a> may be omitted if the <code><a href="the-rp-element.html#the-rp-element">rp</a></code> element is
                    789:   immediately followed by an <code><a href="the-rt-element.html#the-rt-element">rt</a></code> or <code><a href="the-rp-element.html#the-rp-element">rp</a></code>
                    790:   element, or if there is no more content in the parent element.</p><p>An <code><a href="the-optgroup-element.html#the-optgroup-element">optgroup</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end tag</a> may be omitted if the
                    791:   <code><a href="the-optgroup-element.html#the-optgroup-element">optgroup</a></code> element  is immediately followed by
                    792:   another <code><a href="the-optgroup-element.html#the-optgroup-element">optgroup</a></code> element, or if  there is no
                    793:   more content in the parent element.</p><p>An <code><a href="the-option-element.html#the-option-element">option</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    794:   tag</a> may be omitted if the <code><a href="the-option-element.html#the-option-element">option</a></code> element is
                    795:   immediately followed by another <code><a href="the-option-element.html#the-option-element">option</a></code> element, or if
                    796:   it is immediately followed by an <code><a href="the-optgroup-element.html#the-optgroup-element">optgroup</a></code> element, or
                    797:   if there is no more content in the parent element.</p><p>A <code><a href="the-colgroup-element.html#the-colgroup-element">colgroup</a></code> element's <a href="#syntax-start-tag" title="syntax-start-tag">start tag</a> may be omitted if the
                    798:   first thing inside the <code><a href="the-colgroup-element.html#the-colgroup-element">colgroup</a></code> element is a
                    799:   <code><a href="the-col-element.html#the-col-element">col</a></code> element, and if the element is not immediately
                    800:   preceded by another <code><a href="the-colgroup-element.html#the-colgroup-element">colgroup</a></code> element whose <a href="#syntax-end-tag" title="syntax-end-tag">end tag</a> has been omitted. (It can't be
                    801:   omitted if the element is empty.)</p><p>A <code><a href="the-colgroup-element.html#the-colgroup-element">colgroup</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end tag</a> may be omitted if the
                    802:   <code><a href="the-colgroup-element.html#the-colgroup-element">colgroup</a></code> element is not immediately followed by a
                    803:   <a href="common-microsyntaxes.html#space-character">space character</a> or a <a href="#syntax-comments" title="syntax-comments">comment</a>.</p><p>A <code><a href="the-thead-element.html#the-thead-element">thead</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    804:   tag</a> may be omitted if the <code><a href="the-thead-element.html#the-thead-element">thead</a></code> element is
                    805:   immediately followed by a <code><a href="the-tbody-element.html#the-tbody-element">tbody</a></code> or <code><a href="the-tfoot-element.html#the-tfoot-element">tfoot</a></code>
                    806:   element.</p><p>A <code><a href="the-tbody-element.html#the-tbody-element">tbody</a></code> element's <a href="#syntax-start-tag" title="syntax-start-tag">start tag</a> may be omitted if the
                    807:   first thing inside the <code><a href="the-tbody-element.html#the-tbody-element">tbody</a></code> element is a
                    808:   <code><a href="the-tr-element.html#the-tr-element">tr</a></code> element, and if the element is not immediately
                    809:   preceded by a <code><a href="the-tbody-element.html#the-tbody-element">tbody</a></code>, <code><a href="the-thead-element.html#the-thead-element">thead</a></code>, or
                    810:   <code><a href="the-tfoot-element.html#the-tfoot-element">tfoot</a></code> element whose <a href="#syntax-end-tag" title="syntax-end-tag">end
1.1       mike      811:   tag</a> has been omitted. (It can't be omitted if the element is
1.1052    mike      812:   empty.)</p><p>A <code><a href="the-tbody-element.html#the-tbody-element">tbody</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    813:   tag</a> may be omitted if the <code><a href="the-tbody-element.html#the-tbody-element">tbody</a></code> element is
                    814:   immediately followed by a <code><a href="the-tbody-element.html#the-tbody-element">tbody</a></code> or <code><a href="the-tfoot-element.html#the-tfoot-element">tfoot</a></code>
                    815:   element, or if there is no more content in the parent element.</p><p>A <code><a href="the-tfoot-element.html#the-tfoot-element">tfoot</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    816:   tag</a> may be omitted if the <code><a href="the-tfoot-element.html#the-tfoot-element">tfoot</a></code> element is
                    817:   immediately followed by a <code><a href="the-tbody-element.html#the-tbody-element">tbody</a></code> element, or if there is
                    818:   no more content in the parent element.</p><p>A <code><a href="the-tr-element.html#the-tr-element">tr</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    819:   tag</a> may be omitted if the <code><a href="the-tr-element.html#the-tr-element">tr</a></code> element is
                    820:   immediately followed by another <code><a href="the-tr-element.html#the-tr-element">tr</a></code> element, or if there
                    821:   is no more content in the parent element.</p><p>A <code><a href="the-td-element.html#the-td-element">td</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    822:   tag</a> may be omitted if the <code><a href="the-td-element.html#the-td-element">td</a></code> element is
                    823:   immediately followed by a <code><a href="the-td-element.html#the-td-element">td</a></code> or <code><a href="the-th-element.html#the-th-element">th</a></code>
                    824:   element, or if there is no more content in the parent element.</p><p>A <code><a href="the-th-element.html#the-th-element">th</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
                    825:   tag</a> may be omitted if the <code><a href="the-th-element.html#the-th-element">th</a></code> element is
                    826:   immediately followed by a <code><a href="the-td-element.html#the-td-element">td</a></code> or <code><a href="the-th-element.html#the-th-element">th</a></code>
1.123     mike      827:   element, or if there is no more content in the parent element.</p><p><strong>However</strong>, a <a href="#syntax-start-tag" title="syntax-start-tag">start
1.1008    mike      828:   tag</a> must never be omitted if it has any attributes.</p><h5 id="element-restrictions"><span class="secno">8.1.2.5 </span>Restrictions on content models</h5><p>For historical reasons, certain elements have extra restrictions
1.1052    mike      829:   beyond even the restrictions given by their content model.</p><p>A <code><a href="the-table-element.html#the-table-element">table</a></code> element must not contain <code><a href="the-tr-element.html#the-tr-element">tr</a></code>
1.1       mike      830:   elements, even though these elements are technically allowed inside
1.1052    mike      831:   <code><a href="the-table-element.html#the-table-element">table</a></code> elements according to the content models
                    832:   described in this specification. (If a <code><a href="the-tr-element.html#the-tr-element">tr</a></code> element is
                    833:   put inside a <code><a href="the-table-element.html#the-table-element">table</a></code> in the markup, it will in fact imply
                    834:   a <code><a href="the-tbody-element.html#the-tbody-element">tbody</a></code> start tag before it.)</p><p>A single <a href="#syntax-newlines" title="syntax-newlines">newline</a> may be
1.304     mike      835:   placed immediately after the <a href="#syntax-start-tag" title="syntax-start-tag">start
1.1052    mike      836:   tag</a> of <code><a href="the-pre-element.html#the-pre-element">pre</a></code> and <code><a href="the-textarea-element.html#the-textarea-element">textarea</a></code>
1.1       mike      837:   elements. This does not affect the processing of the element. The
1.304     mike      838:   otherwise optional <a href="#syntax-newlines" title="syntax-newlines">newline</a>
1.381     mike      839:   <em>must</em> be included if the element's contents themselves start
                    840:   with a <a href="#syntax-newlines" title="syntax-newlines">newline</a> (because
                    841:   otherwise the leading newline in the contents would be treated like
                    842:   the optional newline, and ignored).</p><div class="example">
1.1052    mike      843:    <p>The following two <code><a href="the-pre-element.html#the-pre-element">pre</a></code> blocks are equivalent:</p>
1.1       mike      844:    <pre>&lt;pre&gt;Hello&lt;/pre&gt;</pre>
                    845:    <pre>&lt;pre&gt;<br>Hello&lt;/pre&gt;</pre>
1.1008    mike      846:   </div><h5 id="cdata-rcdata-restrictions"><span class="secno">8.1.2.6 </span>Restrictions on the contents of raw text and RCDATA elements</h5><p>The text in <a href="#raw-text-elements" title="raw text elements">raw text</a> and
1.889     mike      847:   <a href="#rcdata-elements">RCDATA elements</a> must not contain any occurrences of the
                    848:   string "<code title="">&lt;/</code>" (U+003C LESS-THAN SIGN, U+002F
                    849:   SOLIDUS) followed by characters that case-insensitively match the
                    850:   tag name of the element followed by one of U+0009 CHARACTER
1.1038    mike      851:   TABULATION (tab), U+000A LINE FEED (LF), U+000C FORM FEED (FF), U+000D
1.889     mike      852:   CARRIAGE RETURN (CR), U+0020 SPACE, U+003E GREATER-THAN SIGN (&gt;), or
1.1008    mike      853:   U+002F SOLIDUS (/).</p><h4 id="text-0"><span class="secno">8.1.3 </span>Text</h4><p><dfn id="syntax-text" title="syntax-text">Text</dfn> is allowed inside elements,
1.1108    mike      854:   attribute values, and comments. Extra constraints are placed on what
                    855:   is and what is not allowed in text based on where the text is to be
                    856:   put, as described in the other sections.</p><h5 id="newlines"><span class="secno">8.1.3.1 </span>Newlines</h5><p><dfn id="syntax-newlines" title="syntax-newlines">Newlines</dfn> in HTML may be
1.1       mike      857:   represented either as U+000D CARRIAGE RETURN (CR) characters, U+000A
                    858:   LINE FEED (LF) characters, or pairs of U+000D CARRIAGE RETURN (CR),
1.882     mike      859:   U+000A LINE FEED (LF) characters in that order.</p><p>Where <a href="#syntax-charref" title="syntax-charref">character references</a>
                    860:   are allowed, a character reference of a U+000A LINE FEED (LF)
                    861:   character (but not a U+000D CARRIAGE RETURN (CR) character) also
1.1008    mike      862:   represents a <a href="#syntax-newlines" title="syntax-newlines">newline</a>.</p><h4 id="character-references"><span class="secno">8.1.4 </span>Character references</h4><p>In certain cases described in other sections, <a href="#syntax-text" title="syntax-text">text</a> may be mixed with <dfn id="syntax-charref" title="syntax-charref">character references</dfn>. These can be used
1.1       mike      863:   to escape characters that couldn't otherwise legally be included in
1.588     mike      864:   <a href="#syntax-text" title="syntax-text">text</a>.</p><p>Character references must start with a U+0026 AMPERSAND character
                    865:   (&amp;). Following this, there are three possible kinds of character
                    866:   references:</p><dl><dt>Named character references</dt>
1.1       mike      867: 
                    868:    <dd>The ampersand must be followed by one of the names given in the
                    869:    <a href="named-character-references.html#named-character-references">named character references</a> section, using the same
1.677     mike      870:    case. <span class="impl">The name must be one that is terminated by
                    871:    a U+003B SEMICOLON character (;).</span></dd>
1.1       mike      872: 
                    873: 
                    874:    <dt>Decimal numeric character reference</dt>
                    875: 
                    876:    <dd>The ampersand must be followed by a U+0023 NUMBER SIGN
1.588     mike      877:    character (#), followed by one or more digits in the range U+0030
                    878:    DIGIT ZERO (0) to U+0039 DIGIT NINE (9), representing a base-ten
                    879:    integer that corresponds to a Unicode code point that is allowed
                    880:    according to the definition below. The digits must then be followed
                    881:    by a U+003B SEMICOLON character (;).</dd>
1.1       mike      882: 
                    883: 
                    884:    <dt>Hexadecimal numeric character reference</dt>
                    885: 
                    886:    <dd>The ampersand must be followed by a U+0023 NUMBER SIGN
1.588     mike      887:    character (#), which must be followed by either a U+0078 LATIN
                    888:    SMALL LETTER X character (x) or a U+0058 LATIN CAPITAL LETTER X
                    889:    character (X), which must then be followed by one or more digits in
                    890:    the range U+0030 DIGIT ZERO (0) to U+0039 DIGIT NINE (9), U+0061
                    891:    LATIN SMALL LETTER A to U+0066 LATIN SMALL LETTER F, and U+0041
                    892:    LATIN CAPITAL LETTER A to U+0046 LATIN CAPITAL LETTER F,
1.464     mike      893:    representing a base-sixteen integer that corresponds to a Unicode
                    894:    code point that is allowed according to the definition below. The
                    895:    digits must then be followed by a U+003B SEMICOLON character
                    896:    (;).</dd>
1.378     mike      897: 
                    898:   </dl><p>The numeric character reference forms described above are allowed
1.882     mike      899:   to reference any Unicode code point other than U+0000, U+000D,
                    900:   permanently undefined Unicode characters (noncharacters), and
1.996     mike      901:   control characters other than <a href="common-microsyntaxes.html#space-character" title="space character">space
1.378     mike      902:   characters</a>.</p><p>An <dfn id="syntax-ambiguous-ampersand" title="syntax-ambiguous-ampersand">ambiguous
1.464     mike      903:   ampersand</dfn> is a U+0026 AMPERSAND character (&amp;) that is
1.897     mike      904:   followed by one or more characters in the range U+0030 DIGIT ZERO
                    905:   (0) to U+0039 DIGIT NINE (9), U+0061 LATIN SMALL LETTER A to U+007A
                    906:   LATIN SMALL LETTER Z, and U+0041 LATIN CAPITAL LETTER A to U+005A
                    907:   LATIN CAPITAL LETTER Z, followed by a U+003B SEMICOLON character
                    908:   (;), where these characters do not match any of the names given in
1.1029    mike      909:   the <a href="named-character-references.html#named-character-references">named character references</a> section.</p><h4 id="cdata-sections"><span class="secno">8.1.5 </span>CDATA sections</h4><p><dfn id="syntax-cdata" title="syntax-cdata">CDATA sections</dfn> must consist of
                    910:   the following components, in this order:</p><ol><li>The string "<code title="">&lt;![CDATA[</code>".</li>
                    911: 
                    912:    <li>Optionally, <a href="#syntax-text" title="syntax-text">text</a>, with the
                    913:    additional restriction that the text must not contain the string
                    914:    "<code title="">]]&gt;</code>".</li>
                    915: 
                    916:    <li>The string "<code title="">]]&gt;</code>".</li>
                    917: 
                    918:   </ol><div class="example">
1.724     mike      919: 
                    920:    <p>CDATA sections can only be used in foreign content (MathML or
                    921:    SVG). In this example, a CDATA section is used to escape the
                    922:    contents of an <code>ms</code> element:</p>
                    923: 
                    924:    <pre>&lt;p&gt;You can add a string to a number, but this stringifies the number:&lt;/p&gt;
                    925: &lt;math&gt;
                    926:  &lt;ms&gt;&lt;![CDATA[x&lt;y]]&gt;&lt;/ms&gt;
                    927:  &lt;mo&gt;+&lt;/mo&gt;
                    928:  &lt;mn&gt;3&lt;/mn&gt;
                    929:  &lt;mo&gt;=&lt;/mo&gt;
                    930:  &lt;ms&gt;&lt;![CDATA[x&lt;y3]]&gt;&lt;/ms&gt;
                    931: &lt;/math&gt;</pre>
                    932: 
1.1008    mike      933:   </div><h4 id="comments"><span class="secno">8.1.6 </span>Comments</h4><p><dfn id="syntax-comments" title="syntax-comments">Comments</dfn> must start with the
1.1       mike      934:   four character sequence U+003C LESS-THAN SIGN, U+0021 EXCLAMATION
                    935:   MARK, U+002D HYPHEN-MINUS, U+002D HYPHEN-MINUS (<code title="">&lt;!--</code>). Following this sequence, the comment may
                    936:   have <a href="#syntax-text" title="syntax-text">text</a>, with the additional
                    937:   restriction that the text must not start with a single U+003E
1.588     mike      938:   GREATER-THAN SIGN character (&gt;), nor start with a U+002D
                    939:   HYPHEN-MINUS character (-) followed by a U+003E GREATER-THAN SIGN
                    940:   (&gt;) character, nor contain two consecutive U+002D HYPHEN-MINUS
                    941:   characters (<code title="">--</code>), nor end with a U+002D
                    942:   HYPHEN-MINUS character (-). Finally, the comment must be ended by
1.1       mike      943:   the three character sequence U+002D HYPHEN-MINUS, U+002D
1.996     mike      944:   HYPHEN-MINUS, U+003E GREATER-THAN SIGN (<code title="">--&gt;</code>).</p></body></html>

Webmaster