Detailed explanation of the element and element in HTML5_html5 tutorial skills

element
HTML

element represents a part of a page. Its content is not closely related to other content of this page, or is not related and exists alone. . The

element is usually displayed as a sidebar or some inserted supplementary content. It is usually used to display some definitions in the sidebar, such as catalogs, indexes, glossaries, etc.; it can also be used to display related advertising, author introductions, web applications, related links, a brief introduction to the current page content, etc.

Notes on using the

element:

Do not use the

element to mark bracketed text, as this type of text is considered part of the main content.

Usage example:

XML/HTML CodeCopy content to clipboard

1. <article>
2. <p>
3. The Disney movie <em>The Little Mermaidem> was
4. first released to theaters in 1989.
5. p>
6. <aside>
7. The movie earned $87 million during its initial release.
8. aside>
9. <p>
10. More info about the movie...
11. p>
12. article>

element
Article element (

) hence the name, can represent forum posts, magazine or news articles, blogs, user-submitted comments, interactions component, or other independent content item. Its main semantics is to represent itself as an independent content structure. The internal structure of each

element should be similar, such as a header title (h1-h6 elements), etc.

element usage:

When the

element is used nested, the element represents an article related to the parent element. For example, an

element representing a blog comment can be nested within an

element representing a blog post.
The author’s information in the

element can be represented by the

element, but it does not apply to nested

elements.

The publication date and time of the article in the

element can be represented by the pubdate attribute of the element.

Code sample

XML/HTML CodeCopy content to clipboard

1. <article class="film_review">  
2.   <header>  
3.     <h2>侏罗纪公园h2>  
4.   header>  
5.   <section class="main_review">  
6.     <p>Dinos were great!p>  
7.   section>  
8.   <section class="user_reviews">  
9.     <article class="user_review">  
10.       <p>Way too scary for me.p>  
11.       <footer>  
12.         <p>  
13.           Posted on <time datetime="2015-05-16 19:00">May 16time> by Lisa.   
14.         p>  
15.       footer>  
16.     article>  
17.     <article class="user_review">  
18.       <p>I agree, dinos are my favorite.p>  
19.       <footer>  
20.         <p>  
21.           Posted on <time datetime="2015-05-17 19:00">May 17time> by Tom.   
22.         p>  
23.       footer>  
24.     article>  
25.   section>  
26.   <footer>  
27.     <p>  
28.       Posted on <time datetime="2015-05-15 19:00">May 15time> by Staff.   
29.     p>  
30.   footer>  
31. article>