<

h2 dir=”ltr”>

The List of Content Models
 

In HTML, elements typically belonged in either the block level or inline content model. HTML5 introduces seven main content models.

– Metadata
– Embedded
– Interactive
– Heading
– Phrasing
– Flow
– Sectioning

NOTE!
The HTML5 content models are designed to make the markup structure more meaningful for both the browser and the web designer.

Content Models
 

Metadata: Content that sets up the presentation or behavior of the rest of the content. These elements are found in the head of the document.
Elements:  <base>, <link>, <meta>, <noscript>, <script>, <style>, <title>

Embedded: Content that imports other resources into the document.
Elements:  <audio>,  <video>, <canvas>, <iframe>, <img>, <math>, <object>, <svg>

Interactive: Content specifically intended for user interaction.
Elements: <a>, <audio>, <video>, <button>, <details>, <embed>, <iframe>, <img>, <input>, <label>, <object>, <select>, <textarea>

Heading:  Defines a section header.
Elements: <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <hgroup>

Phrasing: This model has a number of inline level elements in common with HTML4.
Elements: <img>, <span>, <strong>, <label>, <br />, <small>, <sub>, and more.


NOTE!
The same element can belong to more than one content model.

Content Models
 

Flow content: Contains the majority of HTML5 elements that would be included in the normal flow of the document.

Sectioning content: Defines the scope of headings, content, navigation, and footers.
Elements: <article>, <aside>, <nav>, <section>

Holla Tech - Learn HTML5

NOTE!
The various content models overlap in certain areas, depending on how they are being used.

 

BACK NEXT

HTML MAIN COURSE PAGE

 

CONTACT HOLLA TECH LEARN SUPPORT