Tools Tags
directory
Tools Tags
HTML5 Tutorial
HTML5 is the latest revised version of HTML. The standard was completed by the World Wide Web Consortium (W3C) in October 2014.
HTML5 is designed to support multimedia on mobile devices.
HTML5 is simple and easy to learn.
What is HTML5?
HTML5 is the next generation HTML standard.
HTML, the previous version of HTML 4.01 was born in 1999. The world of the Web has changed dramatically since then.
HTML5 is still a work in progress. However, most modern browsers already have some HTML5 support.
How did HTML5 get started?
HTML5 is the result of collaboration between W3C and WHATWG, which stands for Web Hypertext Application Technology Working Group. .
The WHATWG focuses on web forms and applications, while the W3C focuses on XHTML 2.0. In 2006, the two parties decided to collaborate to create a new version of HTML.
Some interesting new features in HTML5:
canvas element for drawing
for media playback video and audio elements
Better support for local offline storage
New special content elements, such as article, footer, header, nav, section
New form controls, such as calendar, date, time, email, url, search
##HTML5 < !DOCTYPE><!doctype> The declaration must be located on the first line in the HTML5 document. It is very simple to use:
<!DOCTYPE html>
Minimum HTML5 documentBelow It is a simple HTML5 document:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>文档标题</title> </head> <body> 文档内容...... </body> </html>
Note: For Chinese web pages, you need to use <meta charset="utf-8"> to declare the encoding , otherwise garbled characters will appear.
Improvements in HTML5
- New elements
- New attributes
- Fully supports CSS3 ##Video and Audio
- ##2D/3D graphics
- Local Storage
- Local SQL Data
- Web Application
- HTML5 Multimedia
Using HTML5, you can simply play video and audio on web pages. HTML5 <video>
- HTML5 <audio>
- ##HTML5 Application
Local data storage
Access local files
Local SQL Data
Cache Reference
Javascript Worker
XHTMLHttpRequest 2
##HTML5 Graphics
Using HTML5 you can simply draw graphics:
Use < canvas> element
- Use inline SVG
- Use CSS3 2D/3D
HTML5 Using CSS3
New Selector
- New Properties
- Animation
- 2D/3D conversion
- Rounded corners
- Shadow effect
- Downloadable fonts
- To learn more about CSS3, please check out the CSS3 tutorial on this site. Semantic Elements
HTML5 adds a lot of semantic elements as follows:
| Tag | Description |
|---|---|
| Define an independent content area of the page. | |
| Define the sidebar content of the page. | |
| Allows you to set a piece of text independent of the text direction setting of its parent element. | |
| Define a command button, such as a radio button, check box, or button | |
| Used to describe the details of a document or a certain part of a document | |
| Define a dialog box, such as a prompt box | |
| The tag contains the title of the details element | ##<figure> |
| <figcaption> | |
| <footer> | |
| <header> | |
| ##<mark> | |
| <meter> | |
| <nav> | |
| <progress> | |
| <ruby> | |
| <rt> | |
| <rp> | |
| <section> | |
| <time> | |
| <wbr> | |
HTML5 FormNew form elements, new attributes, new input types, automatic validation. Removed ElementsThe following HTML 4.01 elements have been removed in HTML5:
Instance <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <meta charset="utf-8"> </head> <body> <video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> 你的浏览器不支持 video 标签。 </video> </body> </html> Run Instance»Click the "Run Instance" button to view the online instance HTML5 Browser SupportClick the "Try it" button to view the online running results. The latest versions of Safari, Chrome, Firefox, and Opera support certain HTML5 features. Internet Explorer 9 will support certain HTML5 features. The method for IE9 and the following versions of browsers to be compatible with HTML5 is to use the html5shiv package of Baidu static resources: <!--[if lt IE9]> <script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script> <![endif]-->After loading, initialize the CSS of the new tag: /*html5*/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block} HTML5 Reference ManualIn this site you can find tags and attribute descriptions about HTML5. For details, please click HTML5 Reference Manual. 
Related videos
Hot AI Tools
Undress AI Tool
Undress images for free 
AI Clothes Remover
Online AI tool for removing clothes from photos. 
Undresser.AI Undress
AI-powered app for creating realistic nude photos 
ArtGPT
AI image generator for creative art from text prompts. 
Stock Market GPT
AI powered investment research for smarter decisions 
Hot Article
Pokemon FireRed and LeafGreen TM locations
1 months ago By DDD
How to use the Python zip function_Parallel traversal of multiple sequences and dictionary construction
1 months ago By DDD
How to draw a histogram in Python_Multi-dimensional classification data comparison and stacked histogram color mapping implementation
1 months ago By DDD
Pokemon FireRed and LeafGreen Gym Leader order
1 months ago By DDD
Instantiation mechanism and reflection application of PHP attributes
1 months ago By DDD
Hot Topics
# Douyin level price list 1-75
20534
7
# wifi shows no ip assigned
13640
4
Popular tool
Notepad++7.3.1
Easy-to-use and free code editor 
SublimeText3 Chinese version
Chinese version, very easy to use 
Zend Studio 13.0.1
Powerful PHP integrated development environment 
Dreamweaver CS6
Visual web development tools 
SublimeText3 Mac version
God-level code editing software (SublimeText3) |
![Getting Started with PHP Practical Development: PHP Quick Creation [Small Business Forum]](https://img.php.cn/upload/course/000/000/035/5d27fb58823dc974.jpg)