标签：标签 音频 语义 controls html5 播放 loop autoplay

　　新增语义化标签

• <header>：头部标签
• <nav>：导航标签
• <article>：内容标签
• <section>：块级标签
• <aside>：侧边栏标签
• <footer>：尾部标签
• <audio>：音频标签
• <video>：视频标签

　　1.音频标签（audio）

　　<audio src=" snow.mp3" ></audio>

　　属性值：autoplay=autoplay，音频自动播放

　　　　　　controls=controls，显示播放控件

　　　　　　loop=loop，循环播放　　　　　　　　　

　　audio 在不同浏览器存在兼容性问题，解决这一问题，需要为音频准备多个格式，视频同理。

　　<audio>

　　　　<source  src="snow.mp3"  type=" audio/mpeg " >

　　　　<source  src="snow.ogg"  type=" audio/ogg "  >

　　</audio>

　　2.视频标签（video）

　　<video  src="snow.mp4" ></video>

　　　属性值：autoplay = autoplay，自动播放

　　　　　　　controls = controls，显示控件

　　　　　　　width = 200px，height = 200px ，设置播放器宽度和高度

　　　　　　　loop = loop，循环播放

　　　　　　　preload = auto / none ，预先加载视频 / 不应加载视频（若有autoplay 则忽略该属性）

　　　　　　　poster = Imgurl ，加载等待的画面图片

　　　　　　　muted = muted ， 静音播放（谷歌浏览器常用）

　　谷歌浏览器对于视频文件，禁止播放功能，解决方法 添加 静音属性，音频暂时没有解决方法

　　注意：

• 这种语义化标签准主要针对搜索引擎的
• 这些新标签页面中可以使用多次
• 在 IE9 中，需要把这些元素转换为块级元素
• 移动端更喜欢使用这些标签

标签：标签,音频,语义,controls,html5,播放,loop,autoplay
来源： https://www.cnblogs.com/qtbb/p/11454866.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。