Element Content Syntax Types

This section describes HTML element content syntax in 5 types: void element, raw text elements, RCDATA elements and normal elements. 'script' and 'style' are raw text elements with text contents with almost no restrictions.

In the previous section, we learned how to specify the content of an HTML element by by enclosing it between element's opening tag and closing tag. Now let's look at some syntax rules that element content must follow.

In the HTML5 specification, HTML elements are divided into 5 types based on their content syntax rules:

1. Void Elements (or Empty Content Elements): "area", "base", "br", "col", "command", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr" - These elements can not have any contents.

2. Raw Text Elements: "script" and "style" - These elements can have text contents that do not contain their closing tags. Some good and bad examples are listed below:

Valid raw text element contents:
<script> 1<2 </script>
<script> 1&2 </script>
<script> </style </script>

Invalid raw text element contents:
<script> </script </script>

3. RCDATA Elements: "textarea" and "title" - These elements can have same contents as raw text elements. Plus they can have character references in their contents. This requires you to use character reference &amp; to represent & in the content. Some good and bad examples are listed below:

Valid RCDATA text element contents:
<textarea> 1<2 </textarea>
<textarea> 1&amp;2 </textarea>
<textarea> </title </textarea>

Invalid RCDATA text element contents:
<textarea> 1&2 </textarea>
<textarea> </textarea </textarea>

4. Foreign Elements: "math" and "svg" - These elements can have contents defined in the MathML namespace and the SVG namespace respectively. Their contents should follow XML syntax rules. See other chapters for examples.

5. Normal Elements: All other HTML elements - These elements can have same contents as RCDATA elements. Plus they can have other elements and comments in their contents. This requires you to use character reference &lt; to represent < in the content. Some good and bad examples are listed below:

Valid normal element contents:
<section> 1&lt;2 </section>
<section> 1&amp;2 </section>

Invalid normal element contents:
<section> 1<2 </section>
<section> 1&2 </section>
<section> </section </section>

Table of Contents

 About This Book

 Introduction of HTML

 Introduction of HTML5 Features

 HTML Document Structure and Content

HTML Document and Elements Syntax

 HTML Document Syntax

 Document Character Set and Encoding

 Entering Comments in HTML Document

 Opening and Closing Tags of Elements

 Using Nested Elements

 Specifying Element Attributes

 Specifying Element Contents

Element Content Syntax Types

 Using Whitespace Characters

 Using Character Entity References

 Using Numeric Character References

 Displayed and Printed HTML Documents

 Responsive Design of Web Pages

 MathML Integration in HTML Documents

 References

 Full Version in PDF/EPUB