HTML Tutorials - Herong's Tutorial Examples - v2.30, by Herong Yang
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 & to represent & in the content. Some good and bad examples are listed below:
Valid RCDATA text element contents: <textarea> 1<2 </textarea> <textarea> 1&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 < to represent < in the content. Some good and bad examples are listed below:
Valid normal element contents: <section> 1<2 </section> <section> 1&2 </section> Invalid normal element contents: <section> 1<2 </section> <section> 1&2 </section> <section> </section </section>
Table of Contents
Introduction of HTML5 Features
HTML Document Structure and Content
►HTML Document and Elements Syntax
Document Character Set and Encoding
Entering Comments in HTML Document
Opening and Closing Tags of Elements
Using Character Entity References
Using Numeric Character References
Displayed and Printed HTML Documents
Responsive Design of Web Pages