HTML5中的标签

<nav> 元素定义导航链接集合。<nav> 元素旨在定义大型的导航链接块。不过,并非文档中所有链接都应该位于 <nav> 元素中!
	<nav>
	<a href="/html/">HTML</a> |
	<a href="/css/">CSS</a> |
	<a href="/js/">JavaScript</a> |
	<a href="/jquery/">jQuery</a>
	</nav>

 HTML5 <figure> 和 <figcaption> 元素,标题(caption)的作用是为图片添加可见的解释。通过 HTML5,图片和标题能够被组合在 <figure> 元素中
	<figure>
	   <img src="pic_mountain.jpg" alt="The Pulpit Rock" width="304" height="228">
	   <figcaption>Fig1. - The Pulpit Pock, Norway.</figcaption>
	</figure> 

HTML最好的音频解决方法
	<audio controls="controls" height="100" width="100">
	  <source src="song.mp3" type="audio/mp3" />
	  <source src="song.ogg" type="audio/ogg" />
	<embed height="100" width="100" src="song.mp3" />
	</audio>

HTML视频播放方法
	1.使用<embed>标签,<embed> 标签的作用是在 HTML 页面中嵌入多媒体元素。(HTML4 无法识别 <embed> 标签,您的页面无法通过验证。如果浏览器不支持 Flash,那么视频将无法播放。iPad 和 iPhone 不能显示 Flash 视频。如果您将视频转换为其他格式,那么它仍然不能在所有浏览器中播放。)
下面的 HTML 代码显示嵌入网页的 Flash 视频:
	<embed src="movie.swf" height="200" width="200"/>

	2.使用 <object> 标签,<object> 标签的作用是在 HTML 页面中嵌入多媒体元素。(如果浏览器不支持 Flash,将无法播放视频。iPad 和 iPhone 不能显示 Flash 视频。如果您将视频转换为其他格式,那么它仍然不能在所有浏览器中播放。)
下面的 HTML 片段显示嵌入网页的一段 Flash 视频:
	<object data="movie.swf" height="200" width="200"/>

	3.使用 <video> 标签,<video> 是 HTML 5 中的新标签。<video> 标签的作用是在 HTML 页面中嵌入视频元素。(必须把视频转换为很多不同的格式。
<video> 元素在老式浏览器中无效。<video> 元素无法通过 HTML 4 和 XHTML 验证。
以下 HTML 片段会显示一段嵌入网页的 ogg、mp4 或 webm 格式的视频:
	<video width="320" height="240" controls="controls">
	  <source src="movie.mp4" type="video/mp4" />
	  <source src="movie.ogg" type="video/ogg" />
	  <source src="movie.webm" type="video/webm" />
	Your browser does not support the video tag.
	</video>

	4.最好的 HTML 解决方法,HTML 5 + <object> + <embed>。HTML 5 <video> 元素会尝试播放以 mp4、ogg 或 webm 格式中的一种来播放视频。如果均失败,则回退到 <embed> 元素。
	<video width="320" height="240" controls="controls">
	  <source src="movie.mp4" type="video/mp4" />
	  <source src="movie.ogg" type="video/ogg" />
	  <source src="movie.webm" type="video/webm" />
	  <object data="movie.mp4" width="320" height="240">
	    <embed src="movie.swf" width="320" height="240" />
	  </object>
	</video>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值