Home >Web Front-end >H5 Tutorial >Summary of new tags and attributes in HTML5

Summary of new tags and attributes in HTML5

不言
不言Original
2018-07-21 11:42:061874browse

This article shares with you a summary of the new tags and attributes in HTML5. The content is very good. Friends in need can refer to it. I hope it can help everyone.

Collect and summarize the new features of HTML5, which can basically be used except for IE9 and below.

HTML5 syntax

Mostly continues the syntax of html

Differences:

at the beginning

Character encoding becomes concise,

is not case sensitive,

Added Boolean value, similar to checked, selected

The quotation marks can be omitted, but in terms of coding standards, it is not recommended,

There are tags that can omit the end character, and tags that can be completely omitted.

Add tags:

##1. Structure tag

(1) Section: independent content block, which can be composed of h1~h6 as an outline to indicate the document structure. It can also have chapters, headers, footers or other parts of the header;

(2) article: a special independent block, indicating the core content in this header;

(3) aside: outside the tag content and the tag content Relevant auxiliary information;

(4) header: header information/title of a certain block;

(5) hgroup: Supplementary content of header information/title;

(6) footer: bottom information;

(7) nav: navigation bar partial information ;

(8) figure: an independent unit, such as a news block with pictures and content.

2. Form label

(1) email: Email must be entered;

(2) url: The url address must be entered;

(3) number: The numerical value must be entered;

(4 ) Range: You must enter a value within a certain range;

(5) Date Pickers: Date selector;

 a.date: Select Day, month, year

b.month: Select month and year

c.week: Select week and year

d.time: Select time (hours and minutes)

e.datetime: Select time, day, month, year (UTC time)

  f.datetime-local: Select time, day, month, year (local time)

(6) search: search for regular text fields;

(7) color: color.

3. Media tag

(1) video: video;

(2) audio: audio;

(3) embed: embedded content (including various media), Midi, Wav, AU, MP3, Flash, AIFF, etc.

4. Other function tags

(1) mark: mark, highlight (like a highlighter) Notes);

(2) progress: progress bar;;

(3) time: data tag, used by search engines; release dateupdate date< ;time datetime="2015- 01-23T04:00" pubdate>4:00;

(4) ruby ​​and rt: comment on a certain word;< ;ruby>Comment contentHow to display when the browser does not support it;

(5 ) wbr: Soft line break, line break when the page width reaches the point where a line break is needed;

(6) canvas: Use JS code to make content for image drawing;

(7) command: button;

(8) deteils: expand menu;

(9) dateilst: text field drop-down prompt ;

(10) keygen: encryption.

New attributes:

Added attributes for js.

##

If there are no above two attributes, the execution order is to first load (download) the first src, then execute its onload, and then execute it synchronously downwards. The defer attribute already exists before h5, and input delayed loading (delayed Execution), it will first load (download) the file content in src, and then wait until the page is fully loaded, then load the js.async attribute in onload, which is asynchronous loading. It will execute onload immediately after loading src, and will continue at the same time. In the order of execution above when loading the page, the alert display will display b first and then a.

Add the style code of the small icon to the label in the web page

##

Ordered list ol: Added start (list starting value), reversed ( Inverted or not) menu menu type attribute (3 menu types) Inline css style: define a style block (scoped) inside the tag, which is only valid inside the style tag. Inline frame: iframe element, newly added seamless borderless Borderless, srcdoc defines the content of the inline frame.