Shulou(Shulou.com)06/03 Report--

This article introduces the relevant knowledge of "detailed explanation of new and commonly used tags in HTML5". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

The new structural elements in HTML5 are divided into main structural elements and non-principal structural elements.

1. The main structural elements include article, section, nav, aside, time

two。 Non-principal structural elements include header, hgroup, footer, address

I. main structural elements

Article

Article tags, semantically viewed as documents and pages, are used as follows:

Usually an article, a page, an independent and complete content module

Usually take a title and put it in the header tag

Article elements can be nested within each other

Use extremely high frequency, emphasize independence, pay more attention to the use of header tags.

The code is as follows:

It's my tag.

I am the paragraph.

My content

Section

The section tag, which is part of the semantics, is used as follows:

A separate block used for the content of a page, often a paragraph of an article

It is usually composed of content and title. Section is not recommended for content without title.

The frequency of use is low, and the emphasis is on segmentation and blocking.

Note: the book "authoritative Guide to HTML5 and CSS3" states that when a container needs to be defined by styles or scripts to define behavior, it is recommended to use div instead of section, and do not use section as a container for styling.

The code is as follows:

Fruits

Apple

Is the apple scattered?

Orange

Is the orange sprinkled?

Chinese characters

The three Kingdoms, the two Jin dynasties and the Northern and Southern dynasties

Three countries

Fierce general

Two Jin dynasties

Fierce general

Nav

The nav tag, semantically defined as navigation, is used as follows:

Usually used as a link group for page navigation

Sidebar navigation

High frequency of use.

The code is as follows:

Menu 1

Menu 2

Menu 3

Aside

The aside tag, semantically defined as being on the side or side, is used as follows:

When used in article tags, it is used as an ancillary information part of the main content, such as relevant references, noun explanations, etc.

When used outside the article tag, it is used as a subsidiary information part of the page or site, such as the sidebar, the links section of the blog, the advertising area, etc.

The frequency of use is low.

The code is as follows:

Who is Jack Ma?

Jack Ma, male, was born in Hangzhou, Zhejiang Province on October 15, 1964. he is a famous Chinese entrepreneur and founder of Alibaba Group, Taobao and Alipay.

references

Baidu, Wikipedia.

Lao Zhao's blog

Brother Ghost's blog

Uncle puma's blog

Time

The time tag, which is time in terms of semantics, is used as follows:

Represents a time or date in 24 hours

The time difference is allowed to indicate the time.

Dates and times in many formats can be defined

The frequency of use is low.

The code is as follows:

March 6, 2014

20:00 on March 6, 2014

20:00 on March 6, 2014

II. Non-main structural elements

Header

The header tag, semantically regarded as the header of the document, is used as follows:

A structural element with the function of guidance and navigation

The title of a content block usually placed on the entire page or within a page

There is no limit on the number of header tags in a web page.

The frequency of use is extremely high and it is easy to understand.

The code is as follows:

I'm the big head.

I'm the neck.

I am the body.

Hgroup

The hgroup tag, which is a title group from a semantic point of view, is used as follows:

As a child element of the header tag

A content module includes a main title and at least one subtitle before using hgroup

H2~h7 elements are usually grouped

High frequency of use.

The code is as follows:

I'm Liu Bei.

I'm Guan Yu.

I'm Zhang Fei.

Lv Bu was stunned.

Footer

The footer tag, semantically regarded as a footnote to the document, is used as follows:

A footnote for a content block area

Usually the content is contact information, related reading, copyright information, etc.

It is easy to understand because of its high frequency.

The code is as follows:

Lv Bu was stunned.

About the three Kingdoms

Map information

Introduction

Address

The address tag, which is an address in terms of semantics, is used as follows:

Used for contact information presented in the document

Usually the content is author, website link, email address, phone number, etc.

The frequency of use is low.

The code is as follows:

Author: Zhang Sanfeng

Address: Wudang Mountain

Contact information: 1247

This is the end of the introduction of "detailed explanation of New and commonly used tags in HTML5". Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.