nykek5i 发表于 2024-10-3 11:11:11

HTML 音频(Audio)


    <div style="color: black; text-align: left; margin-bottom: 10px;">
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">声音在HTML中<span style="color: black;">能够</span>以<span style="color: black;">区别</span>的方式播放.</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">问题以及<span style="color: black;">处理</span><span style="color: black;">办法</span></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在 HTML 中播放音频并<span style="color: black;">不易</span>!</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">您需要谙熟<span style="color: black;">海量</span>技巧,以<span style="color: black;">保证</span>您的音频文件在所有浏览器中(Internet Explorer, Chrome, Firefox, Safari, Opera)和所有硬件上(PC, Mac , iPad, iPhone)都能够播放。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在这W3CSchool 为您总结了问题和<span style="color: black;">处理</span><span style="color: black;">办法</span>。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><img src="https://p3-sign.toutiaoimg.com/111200046765a3ce9032~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1728097373&amp;x-signature=Cr%2BAraCiMfm0HqxI%2F8EkOEmSRKQ%3D" style="width: 50%; margin-bottom: 20px;"></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">运用</span>插件</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">浏览器插件是一种扩展浏览器标准功能的小型计算机程序。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">插件<span style="color: black;">能够</span><span style="color: black;">运用</span> &lt;object&gt; 标签 <span style="color: black;">或</span> &lt;embed&gt; 标签添加在页面上. </p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">这些标签定义资源(<span style="color: black;">一般</span>非 HTML 资源)的容器,<span style="color: black;">按照</span>类型,它们即会由浏览器<span style="color: black;">表示</span>,<span style="color: black;">亦</span>会由<span style="color: black;">外边</span>插件显示。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">运用</span> &lt;embed&gt; 元素</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;embed&gt;标签定义<span style="color: black;">外边</span>(非 HTML)内容的容器。(这是一个 HTML5 标签,在 HTML4 中是<span style="color: black;">违法</span>的,<span style="color: black;">然则</span>所有浏览器中都有效)。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">下面的代码片段能够<span style="color: black;">表示</span>嵌入网页中的 MP3 文件:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">实例</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;embed height="50" width="100" src="horse.mp3"&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><img src="https://p3-sign.toutiaoimg.com/1116000345211cb81097~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1728097373&amp;x-signature=fhLBsMCPMA5f6YbNqLMf3PrbSUQ%3D" style="width: 50%; margin-bottom: 20px;"></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">问题:</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;embed&gt; 标签在 HTML 4 中是无效的。页面<span style="color: black;">没法</span><span style="color: black;">经过</span> HTML 4 验证。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">区别</span>的浏览器对音频格式的支持<span style="color: black;">亦</span><span style="color: black;">区别</span>。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>浏览器不支持该文件格式,<span style="color: black;">无</span>插件的话就<span style="color: black;">没法</span>播放该音频。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>用户的计算机未安装插件,<span style="color: black;">没法</span>播放音频。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>把该文件转换为其他格式,仍然<span style="color: black;">没法</span>在所有浏览器中播放。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">使用 &lt;object&gt; 元素</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;object tag&gt; 标签<span style="color: black;">亦</span><span style="color: black;">能够</span>定义<span style="color: black;">外边</span>(非 HTML)内容的容器。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">下面的代码片段能够<span style="color: black;">表示</span>嵌入网页中的 MP3 文件:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">实例</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;object height="50" width="100" data="horse.mp3"&gt;&lt;/object&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">问题:</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">区别</span>的浏览器对音频格式的支持<span style="color: black;">亦</span><span style="color: black;">区别</span>。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>浏览器不支持该文件格式,<span style="color: black;">无</span>插件的话就<span style="color: black;">没法</span>播放该音频。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>用户的计算机未安装插件,<span style="color: black;">没法</span>播放音频。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>把该文件转换为其他格式,仍然<span style="color: black;">没法</span>在所有浏览器中播放。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">运用</span> HTML5 &lt;audio&gt; 元素</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML5 &lt;audio&gt; 元素是一个 HTML5 元素,在 HTML 4 中是<span style="color: black;">违法</span>的,但在所有浏览器中都有效。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">The &lt;audio&gt; element works in all modern browsers.</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">以下<span style="color: black;">咱们</span>将<span style="color: black;">运用</span> &lt;audio&gt; 标签来描述 MP3 文件(Internet Explorer、Chrome 以及 Safari 中是有效的), <span style="color: black;">一样</span>添加了一个 OGG 类型文件(Firefox 和 Opera浏览器中有效).<span style="color: black;">倘若</span>失败,它会<span style="color: black;">表示</span>一个错误文本信息:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">实例</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;audio controls&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"> &lt;source src="horse.mp3" type="audio/mpeg"&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"> &lt;source src="horse.ogg" type="audio/ogg"&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">Your browser does not support this audio format.</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;/audio&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><img src="https://p3-sign.toutiaoimg.com/119a00030bcaf22e2a81~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1728097373&amp;x-signature=i0ZNOkJCnCn9Rrn1EgzgtF%2BGtPw%3D" style="width: 50%; margin-bottom: 20px;"></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">问题:</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;audio&gt; 标签在 HTML 4 中是无效的。您的页面<span style="color: black;">没法</span><span style="color: black;">经过</span> HTML 4 验证。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">您必须把音频文件转换为<span style="color: black;">区别</span>的格式。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;audio&gt; 元素在老式浏览器中不起<span style="color: black;">功效</span>。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">最好的 HTML <span style="color: black;">处理</span><span style="color: black;">办法</span></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">下面的例子<span style="color: black;">运用</span>了两个<span style="color: black;">区别</span>的音频格式。HTML5 &lt;audio&gt; 元素会尝试以 mp3 或 ogg 来播放音频。<span style="color: black;">倘若</span>失败,代码将回退尝试 &lt;embed&gt; 元素。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">实例</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;audio controls height="100" width="100"&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;source src="horse.mp3" type="audio/mpeg"&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"> &lt;source src="horse.ogg" type="audio/ogg"&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"> &lt;embed height="50" width="100" src="horse.mp3"&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;/audio&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">问题:</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">您必须把音频转换为<span style="color: black;">区别</span>的格式。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;embed&gt; 元素<span style="color: black;">没法</span>回退来<span style="color: black;">表示</span>错误<span style="color: black;">信息</span>。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">雅虎<span style="color: black;">媒介</span>播放器 - 一个简单的添加音频到你网站上的方式</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">运用</span>雅虎播放器是免费的。如需<span style="color: black;">运用</span>它,您需要把这段 JavaScript <span style="color: black;">插进</span>网页底部:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">雅虎播放器<span style="color: black;">能够</span>播放MP3以及其他<span style="color: black;">各样</span>格式。你只需添加一行代码到你的页面或 博客中就<span style="color: black;">能够</span><span style="color: black;">容易</span>地将您的HTML页面制作成 专业的播放列表:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">实例</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;a href="horse.mp3"&gt;Play Sound&lt;/a&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;script src="http://mediaplayer.yahoo.com/latest"&gt;&lt;/script&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>你要<span style="color: black;">运用</span>它,您需要把这段 JavaScript <span style="color: black;">插进</span>网页底部:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;script src="http://mediaplayer.yahoo.com/latest"&gt;&lt;/script&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">而后</span>只需简单地把 MP3 文件链接到您的 HTML 中,JavaScript 会自动地为每首歌创建播放按钮:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;a href="song1.mp3"&gt;Play Song 1&lt;/a&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;a href="song2.wav"&gt;Play Song 2&lt;/a&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">...</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">...</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">雅虎媒体播放器为您的用户<span style="color: black;">供给</span>的是一个小型的播放按钮,而不是完整的播放器。<span style="color: black;">不外</span>,当您点击该按钮,会弹出完整的播放器。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">请<span style="color: black;">重视</span>,这个播放器始终停靠在窗框底部。只需点击它,就可将其滑出。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">运用</span>超链接</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>网页<span style="color: black;">包括</span>指向<span style="color: black;">媒介</span>文件的超链接,大<span style="color: black;">都数</span>浏览器会<span style="color: black;">运用</span>"辅助应用程序"来播放文件。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">以下代码片段<span style="color: black;">表示</span>指向 mp3 文件的链接。<span style="color: black;">倘若</span>用户点击该链接,浏览器会<span style="color: black;">起步</span>"辅助应用程序"来播放该文件:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">实例</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;a href="horse.mp3"&gt;Play the sound&lt;/a&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">内联的声音说明</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">当您在网页中<span style="color: black;">包括</span>声音,<span style="color: black;">或</span><span style="color: black;">做为</span>网页的<span style="color: black;">构成</span>部分时,它被<span style="color: black;">叫作</span>为内联声音。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>您打算在 web 应用程序中<span style="color: black;">运用</span>内联声音,您需要<span style="color: black;">认识</span>到<span style="color: black;">非常多</span>人都觉得内联声音令人恼火。<span style="color: black;">同期</span>请<span style="color: black;">重视</span>,用户可能<span style="color: black;">已然</span>关闭了浏览器中的内联声音选项。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">咱们</span>最好的<span style="color: black;">意见</span>是<span style="color: black;">仅在</span>用户<span style="color: black;">期盼</span>听到内联声音的<span style="color: black;">地区</span><span style="color: black;">包括</span>它们。一个正面的例子是,在用户需要听到录音并点击某个链接时,会打开页面<span style="color: black;">而后</span>播放录音。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML 多<span style="color: black;">媒介</span>标签</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">New : HTML5 新标签</p>
      <div style="color: black; text-align: left; margin-bottom: 10px;">
            <div style="color: black; text-align: left; margin-bottom: 10px;">标签描述&lt;embed&gt;定义内嵌对象。HTML4 中不赞成,HTML5 中<span style="color: black;">准许</span>。&lt;object&gt;定义内嵌对象。&lt;param&gt;定义对象的参数。&lt;audio&gt;New定义了声音内容&lt;video&gt;New定义一个视频<span style="color: black;">或</span>影片&lt;source&gt;New定义了media元素的多<span style="color: black;">媒介</span>资源(&lt;video&gt; 和 &lt;audio&gt;)&lt;track&gt;New规定media元素的字幕文件或其他<span style="color: black;">包括</span>文本的文件 (&lt;video&gt; 和&lt;audio&gt;)</div>
      </div>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">如您还有不明白的<span style="color: black;">能够</span>在下面与我留言或是与我探讨QQ群308855039,<span style="color: black;">咱们</span><span style="color: black;">一块</span>飞!</p>
    </div>




b1gc8v 发表于 2024-10-29 05:42:58

网站建设seio论坛http://www.fok120.com/

m5k1umn 发表于 昨天 13:17

网站建设seio论坛http://www.fok120.com/
页: [1]
查看完整版本: HTML 音频(Audio)