I recently learned about HTML5. I personally think that in the future, cross-platform platforms may be the leading role of HTML5, so I decided to study it. The followingArticleMost of them are taken from the Internet. If you find that your copyright has been infringed, please let me know. Objective To facilitate learning and reading.
New HTML5 features
• Canvas elements used for painting
• Video and audio elements used for media playback
• Better support for local offline storage
• New special content elements, such as article, footer, header, NAV, and Section
• New Form controls, such as calendar, date, time, email, URL, and search
HTML 5 video
Many trendy websites provide videos. HTML5 provides the standard for displaying videos.
Video on the Web
Until now, there is still no standard for displaying videos on webpages.
Today, most videos are displayed through plug-ins (such as flash. However, not all browsers have the same
.
HTML5 specifies a standard method to include videos through video elements.
Video Format
Currently, the video element supports two video formats:
Internet Explorer Firefox 3.5 opera 10.5 chrome 3.0 safari 3.0
Ogg x
MPEG 4 x
Ogg = Ogg file with thedora video encoding and Vorbis Audio Encoding
MPEG4 = MPEG 4 files with H.264 video encoding and AAC audio encoding
How to work
To display videos in HTML5, all you need are:
<Video src = "movie.ogg" controls = "controls">
</Video>
The control attribute allows you to add playback, pause, and volume controls.
It is also a good idea to include the width and height attributes.
The content inserted between <video> and </video> is displayed by browsers that do not support video elements:
Instance
<Video src = "movie.ogg" width = "320" Height = "240" controls = "controls">
Your browser does not support the video tag.
</Video>
The above example uses an Ogg file, which is applicable to Firefox, opera, and chrome browsers.
Make sure that the video file type is MPEG4 for safari.
The video element allows multiple source elements. The source element can be used to link different video files. The browser will use
A recognizable format:
Instance
<Video width = "320" Height = "240" controls = "controls">
<Source src = "movie.ogg" type = "Video/Ogg">
<Source src = "movie.mp4" type = "Video/MP4">
Your browser does not support the video tag.
</Video>