Home > Web Front-end > Front-end Q&A > What are the features of html5

What are the features of html5

青灯夜游
Release: 2021-12-01 14:04:22
Original
9778 people have browsed it

html5 features include: 1. Semantic tags; 2. Enhanced form input type; 3. Support video and audio playback; 4. Canvas drawing; 5. SVG drawing; 6. Geolocation; 7. Drag Put API; 8. Web Worker; 9. Web Storage; 10. WebSocket.

What are the features of html5

The operating environment of this tutorial: Windows 7 system, HTML5 version, Dell G3 computer.

Top Ten New Features of HTML5

In order to better handle today's Internet applications, HTML5 has added many new elements and functions, such as: graphics drawing, multimedia Content, better page structure, better form handling, and several APIs for dragging and dropping elements, positioning, including web application caching, storage, web workers, etc.

(1) Semantics Tag

Semantic tags make the content of the page structured and well-known

Tag Description
Defines the header area of ​​the document
defines the footer area of ​​the document
defines the navigation of the document
Define the section (section, section) in the document
< ;/article>
Define the independent content area of ​​the page
Define the sidebar content of the page
Details used to describe a document or a certain part of a document
The tag contains the title of the details element
Define the dialog Box, such as prompt box

(2) Enhanced form input type

HTML5 has multiple new form Input input types . These new features provide better input control and validation.

Input type

Description

color

Mainly used to select colors

date

Select a date from a date picker

datetime

Select a date (UTC time)

datetime-local

Select a date and time (no time zone)

email

Input field containing the e-mail address

month

Select a month

number

Input of numerical value Field

range

Input field for numeric values ​​within a certain range

search

Used for search domain

tel

Define the input phone number field

time

Select a time

url

Input of URL address Field

week

Select the week and year

HTML5 also adds the following Form Element

Form Element Description

The element specifies the option list of the input field

Use the list attribute of the element to bind the id of the element

Provides a reliable way to authenticate the user

The tag specifies the key pair generator field to be used in the form.

For different types of output

such as calculations or scripts Output

 HTML5’s new form attribute

    • placehoder attribute, a short prompt will be displayed on the input field before the user enters the value. That is, our common default prompt of the input box disappears after the user inputs.
    • required attribute is a boolean attribute. The input field required to be filled in cannot be empty. The
    • pattern attribute describes a regular expression used to verify the value of the element.
    • min and max attributes, set the minimum and maximum value of the element.
    • step attribute specifies the legal number interval for the input field.
    • The height and width attributes are used for the image height and width of the tag of type image.
    • The autofocus attribute is a boolean attribute. Specifies that the field automatically gains focus when the page loads.
    • multiple attribute is a boolean attribute. Specifies that multiple values ​​can be selected within the element.

(3) Video and audio

  • ##HTML5 provides a standard for playing audio files, that is, using
  • <audio controls>
      <source src="horse.ogg" type="audio/ogg">
      <source src="horse.mp3" type="audio/mpeg">
    您的浏览器不支持 audio 元素。
    </audio>
    Copy after login
The control attribute is used to add play, pause and volume controls.

Between you need to insert the prompt text of the
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template