Analysis on HTML5 page layout of mobile devices-html5 tutorial skills-

This article introduces the html5 page layout of mobile devices. If you are interested in the disk article, let's take a look at the features of mobile devices (mobile phones and tablets, this section describes the semantic tag elements added to HTML5 and the knowledge and examples of Web page layout in mobile Web browsers.
Among the new elements added to the HTML5 standard, header footer nav aside article section hgroup is used for common page structures.
This element is briefly introduced below:
1. header
Header> A page combination of Element Definition documents. Usually, some guidance and navigation information is displayed. A tag usually contains the header information of secti-on, such as h1 ~ H6 or hgroup.

The Code is as follows:

HTML5 layout Learning
　　

Hard work

It is consistent with the following code:

The Code is as follows:

HTML5 layout Learning
　　

Hard work

2. footer

The end of an element definition document or chapter contains the basic information of some chapters, such as the author information, related links, and copyright information. You can use multiple headers and footers on a page, or insert some other elements, such as p ul.

The Code is as follows:

　　

Privacy Information

　　

About us

3. nav

Elements are used to define build navigation and display navigation links. They are used to place the main navigation links of some current pages.

The Code is as follows:

　　
　　　　

　　　　　　
• Privacy Information

　　　　　　
• Copyright information

　　　　　　
• About us

　　　　　　
• Contact us

　　　　

　　

4. aside
An element is used to define a page area to indicate the main content related to the page. It is used to load non-body content, such as the advertisement bar and sidebar.
5. article
An element represents a document. A page is used to display an independent article, such as a website news or a blog article.
　　

The Code is as follows:

　　　　

HTML5 New Elements
　　　　　　

New elements of article

　　　　　　
　　　　　　　　

　　　　　　　　　　
• Article tag 1

　　　　　　　　　　
• Article tag 2

　　　　　　　　

　　　　　　
　　　　
　　

6. section
　　　

Section in the first article of the element, such as chapter, header, and footer.
　　

The Code is as follows:

　　　　

　　　　　　
　　　　　　

　　　　
　　　　
　　　　　　
　　　　　　

　　　　
　　

7. hgroup
　　

It is defined to combine the title elements of a webpage or segment ~ H6 label nodes are grouped.
　　

The Code is as follows:

　　　　
　　　　　　　　
　　　　　　　　
　　　　
　　

In fact, in addition to the semantic tags we introduced, more tags with different semantics are defined in the HTML5 standard.
* Audio: defines the audio content.
* Canvas: defines the canvas function.
* Command: defines a command button.
* Datalist: defines a drop-down list.
* Details: defines the details of an element.
* Dialog: defines a dialog box.
* Keygen: defines a claimed key value in the form.
* Mark: defines tagged text.
* Output: defines some output types.
* Progress: defines the task process.
* Source: defines media resources.
* Video: defines the content of a video.
Although many new elements are added to the HTML5 standard, there are not many opportunities to use them in mobile Web applications.
Although tags such as audio and video can be used in mobile Web applications, due to performance, compatibility, page rendering, and other reasons, they cannot be well applied to smartphones and tablet Web browsers.