前端：HTML5/36/HTML5简介，文档类型定义，网页字符集，页面结构标记，文章相关的标记，其它标记，音频标记，视频标记，表单中新增的属性，表单input元素type属性的值

最新推荐文章于 2021-06-25 09:45:42 发布

浅香沉木

最新推荐文章于 2021-06-25 09:45:42 发布

阅读量362

点赞数

文章标签： js html5

本文链接：https://blog.csdn.net/Java_53/article/details/106170771

版权

HTML５简介

HTML５是新一代的HTML；
HTML5目前主要应用在手机端，在PC端最新浏览器已经开始支持了，但还不全面；
HTML5是由W3C和WHATWG合作的结果；
W3C是万维网联盟，主要制作各种互联网标准的国际组织，如：XHTML,CSS,JavaScript,XML,AJAX等；
WHATWG应用程序工作组，是由Firefox，Chrome，苹果，safari,IE等浏览器公司成立了一个机构，主要面向应用程序的完善和开发，表单的扩展，如：1，在HTML5中使用<video>标记，直接可以播放视频；
2，<input type=“email” name =“email”/>邮箱验证
3，<input type=“color” name =“color”/>
4，<input type=“date” name =“date”/>

HTML5支持度测试(打开要测试的浏览器输入以下网址)

http://chrome.360.cn/test/html5/index.html

浏览器市场份额统计

http://tongji.baidu.com/data/browser

文档类型定义

XHTML1.0中的文档类型定义有三种：过渡型，严格型，框架型；
HTML5文档类型定义:<!DOCTYPE html>

网页字符集

HTML5中的网页字符集声明：<meta charset=“utf-8”>

页面结构标记

<header></header>网页头部；
<nav></nav>导航栏，菜单栏；
<footer></footer>页脚（网页尾部）；

文章相关的标记

<article> : 代表一篇文章；
<aside>：侧边栏；
<section>：区块，主要用于排版网页功能与<div>一样；
<details>：一个标题的简介；
<summary>：标题的内容，与<details>配合使用；

其它标记

<mark>：重点标注；

<progress>：进度条；

progress标记的属性：
1，max:最大值；
2，value:当前值；

音频标记：<audio>属性

语法格式：<audio>对不起，你的浏览器不支持audio元素。</audio>
常用属性：
1，controls：是否显示控制面板；
2，autoplay：是否自动开始；
3，src：播放文件路径；
4，loop：是否循环；
例：<audio controls=“controls” autoplay=“autoplay” src=“images/10000.mp3”>对不起，你的浏览器不支持audio元素！</audio>
显示效果在&video>视频标记的例子中的显示效果中一同展示

视频标记<video>属性

语法格式：<video>对不起，你的浏览器不支持video元素!</video>
常用属性：
1，controls:是否显示控制面板；
2，autoplay:是否自动开始；
3，src：视频路径，支持的文件格式：ogg,mp4;
4，loop ：是否循环；
5，width :宽度；
6，height :高度；
7，poster :第一帧的画面图片，默认的是视频的第一帧；
例：<video controls=“controls” autoplay=“autoplay” src=“images/ry.mp4” width=“500” height=“325” poster=“images/p4.jpg”>对不起，你的浏览器不支持video元素！</video>
显示效果如下：
在这里插入图片描述