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

This article mainly explains "what new functions are added to HTML5". Interested friends may wish to have a look. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn what new features are added to HTML5.

I. the concept of HTML5

HTML5 is not only the latest version of HTML markup language, but more importantly, it formulates a series of standards for Web application development, and becomes the first HTML language to use Web as an application development platform. HTML5 defines a series of new elements, such as new semantic tags, smart forms, multimedia tags, etc., which can help developers create rich Internet applications, while there is a dazzling css 3, and also provides some Javascript API, such as geographic location, gravity sensing, hardware access, etc., you can implement native applications in the browser, create webApp, and even combined with Canvas we can develop web-based games.

Second, a brief introduction to the new part of HTML5

1. New structure label

(1) header (head) (2) nav (navigation) (3) section (body) (4) aside (sidebar) (5) article (content) (6) footer (bottom)

Function: just like div, it only adds semantics to facilitate SEO optimization.

Expansion: SEO optimization can improve the ranking of the site in the search engine, in the front-end practical application, we will use more semantic tags, while for some special characters, we use high-weight tags to wrap the website logo.

two。 New Smart form

2.1 the type attribute value has been added to the input form:

Type= "email" restricts that user input must be of type Email

Type= "url" restricts that user input must be of type URL

Type= "date" automatically generates a date control

Type= "time" ditto

Type= "month" ditto

Type= "week" ditto

Type= "number" restricts user input to be of numeric type

Type= "range" produces a slider form

Type= "search" produces a form of search meaning

Type= "color" generates a color selection form

Smart forms are often used on the mobile side, and they will call the phone's own controls.

2.2 form Intelligent Verification

Required = > verify that the form is empty and must be used with the form form

Pattern = > Custom validation form rules, matching regular

Invalid = > events triggered when validation fails

Dom.setCustomValidity () = > Custom pop-up content parameters: string Custom content

2.3 New properties of the form

Placeholder= > placeholder text, experience more

Autofocus = > automatically get focus dom.focus ()

Autocomplete= > automatic completion next time after submitting once Note: must be submitted once and must have name attribute at the same time

Multiple = > cooperate with file control to realize multiple selection

Form = > associates with the id value of the form form and can be submitted anywhere, but it is not recommended

2.4 Intelligent form filtering (datalist)

Similar to a search prompt, entering a content prompts the associated matching prompt. It is achieved by contacting the datalist tag using the form's list = "id value of datalist".

2.5 video and audio tags

Video tags have been added to HTML5 to enable video playback instead of flash technology.

Attribute: autoplay = > Video is played after loading by default; controls = > controls for playback

At this point, I believe you have a deeper understanding of "what new features are added to HTML5". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

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.