1. HTML5简介
HTML5 是最新的 HTML 标准。
HTML5 是专门为承载丰富的 web 内容而设计的，并且无需额外插件。
HTML5 拥有新的语义、图形以及多媒体元素。
HTML5 提供的新元素和新的 API 简化了 web 应用程序的搭建。
HTML5 是跨平台的，被设计为在不同类型的硬件（PC、平板、手机、电视机等等）之上运行。
HTML5文档声明:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title of the document</title>
</head>
<body>
Content of the document......
</body>
</html>
2. HTML5新语义元素
HTML5新增很多新元素来构建文档结构。
| 新元素 | 解释 |
|---|---|
| header | 定义文档的页眉 （头部） |
| nav | 定义导航链接的部分 |
| main | 定义文档的主内容 |
| article | 定义页面内文章 |
| selection | 定义文档中的节（区段） |
| aside | 定义其所处内容之外的内容 侧边 |
| footer | 定义文档或节的页脚（底部） |
3. HTML5多媒体标签
多媒体embed
embed可以用来插入各种多媒体，格式可以是Midi、Wav、AIFF、AU、MP3等等。url为音频或视频文件及其路径，可以是相对路径或绝对路径。
<embed src="http://player.youku.com/player.php/sid/XMTI4MzM2MDIwOA==/v.swf" allowFullScreen="true" quality="high" width="480" height="400" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash"></embed>
多媒体audio
audio元素能够播放声音文件或者音频流。不同的浏览器可支持播放的格式是不一样的，下图供参考:
使用语法如下：
<audio src="song.ogg" controls="controls"></audio>
audio标签属性:
| 属性 | 值 | 描述 |
|---|---|---|
| autoplay | autoplay | 音频在就绪后马上播放(自动播放) |
| controls | controls | 向用户显示控件 |
| loop | loop | 音频播放循环 |
| preload | perload | 音频在页面加载时进行加载，并预备播放。如果使用 “autoplay”，则忽略该属性。 |
| src | url | 要播放的音频的 URL |
实际工作中，要保证多浏览器兼容问题会将统一资源的不同类型均设置一份。audio 元素允许设置多个source 元素，source 元素可以链接不同类型的音频文件。浏览器将使用第一个可识别的格式。
<audio autoplay="autoplay" controls>
<source src="bgsound.mp3"> <br>
<source src="bgsound.ogg"> <br>
<source src="bgsound.wav"> <br>
你的浏览器不支持音频播放！
</audio>
注意：<audio> 与 </audio> 之间插入的文本内容是供不支持 audio 元素的浏览器显示的。
多媒体video
video标签能够播放视频文件或者视频流。不同的浏览器可支持播放的格式是不一样的，下图供参考:
使用语法如下：
<video src="movie.ogg" controls="controls"></video>
video标签属性:
| 属性 | 值 | 描述 |
|---|---|---|
| autoplay | autoplay | 音频在就绪后马上播放(自动播放) |
| controls | controls | 向用户显示控件 |
| loop | loop | 音频播放循环 |
| preload | perload | 音频在页面加载时进行加载，并预备播放。如果使用 “autoplay”，则忽略该属性。 |
| src | url | 要播放的音频的 URL |
| height | pixels | 播放器高度 |
| width | pixels | 播放器宽度 |
实际工作中，要保证多浏览器兼容问题会将统一资源的不同类型均设置一份。video元素允许设置多个source 元素，source 元素可以链接不同类型的视频文件。浏览器将使用第一个可识别的格式。
<video controls autoplay>
<source src="movie04.mp4"> <br>
<source src="movie04.ogg"> <br>
你的浏览器不支持视频播放！
</video>
注意：<video> 与 </video> 之间插入的文本内容是供不支持 audio 元素的浏览器显示的。
扫一扫
1551
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
