HTML——添加网页背景音乐[通俗易懂]

HTML——添加网页背景音乐[通俗易懂]方式一:<videocontrols=””autoplay=””name=”media”><sourcesrc=”音乐”type=”audio/mpeg”></video><videocontrols=”true”autoplay=”true”name=”media”loop=”true”hidden=”true”>…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

方式一:

<video controls="" autoplay="" name="media"> <source src="音乐" type="audio/mpeg"></video>
<video controls="true" autoplay="true" name="media" loop="true" hidden="true"> <source src="音乐链接" type="audio/mpeg"></video>

 

方式二:

在<head></head>中的title标签之下添加以下这行代码

<embed src="music/We Don't Talk Anymore.mp3" autostart="true" loop="true" hidden="true"></embed>

这个方式主要是支持的播放器多。一定程度上解决了浏览器兼容的问题。

说明:

1、src=””,在””内添加你音乐的保存路径。
2、使用hidden=”true”表示隐藏音乐播放按钮,相反使用hidden=”false”表示开启音乐播放按钮。
3、使用autostart=”true” 表示是打开网页加载完后自动播放。
4、使用loop=”true”表示 循环播放 如仅想播放一次则为:loop=”false”
 

方式三:

<audio autoplay="" loop=""> <source src="http://mi.0w0.im/Letter_Song.mp3"></audio>

    这个不显示播放器。

 

方式四:

<bgsound src=背景音乐链接地址 loop=-1>
<bgsound src="音乐保存的绝对路径" autostart=true loop=infinite> 

说明:1、使用autostart=true,表示音乐在网页加载同时加载音乐,打开网页时音乐自动播放。

方式五:

<audio src="music/We Don't Talk Anymore.mp3" id="aud" autoplay="autoplay" controls="controls" preload="auto"></audio>

说明:

1、使用autoplay=”autoplay”,则背景音乐将在音网页打开后就自动马上播放。

2、使用controls=”controls”,则为了在页面内显示显示控件,如播放按钮。

3、使用”loop=”loop”,则是为了是背景音乐重复播放。

4、使用preload=”auto”,则音频在页面加载的同时进行加载,并预备播放。

5、使用src=””,即是在””内加入背景音乐的保存路径,如:src=”web网页制作\03.mp3″。

注:若是想播放按钮隐藏,则使用以下语句:

    直接使用css 的display控制audio标签的显示:

<style type="text/css">
     audio{
             display: none;
         }
</style>

 

参考文章

https://www.w3school.com.cn/html/html_audio.asp 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/189688.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 卸载oracle数据库

    卸载oracle数据库

    2021年11月14日
    46
  • hexdump -C_linux生成dump

    hexdump -C_linux生成dump描述:hexdump命令一般用来查看”二进制”文件的十六进制编码,从手册上查看,其查看的内容还要很多,诸如:ascii,decimal,hexadecimal,octal参数:hexdump[-bcCdovx][-eformat_string][-fformat_file][-nlength][-sskip]file示例:新增一个文本文件,在test文本中添加如下内容:…

    2022年9月21日
    4
  • 【安装填坑】—- ERROR: Could not install packages due to an OSError: [Errno 2] No such file or directory:

    【安装填坑】—- ERROR: Could not install packages due to an OSError: [Errno 2] No such file or directory:用anaconda安装python开发环境的时候,使用pip安装某些包,会弹出如下这种提示ERROR:CouldnotinstallpackagesduetoanOSError:[Errno2]Nosuchfileordirectory:’d:\users\xxxx\appdata\local\continuum\anaconda3\envs\faiss\lib\site-packages\numpy-1.20.3.dist-info\METADATA’除了要修改注册表

    2022年6月24日
    99
  • STM32开发项目:ADS1115的驱动与使用

    STM32开发项目:ADS1115的驱动与使用日期作者版本说明2020.09.24TaoV0.0完成主体内容的撰写目录ADS1115介绍驱动源码头文件源文件使用指南基本步骤注意事项ADS1115介绍ADS1115是具有PGA、振荡器、电压基准、比较器的16位、860SPS、4通道Δ-ΣADC,数据通过一个I2C兼容型串行接口进行传输。有关它的详细说明可以参考官方数据手册。驱动源码头文件#ifndef__ADS1115_H__#define__ADS1115_H__#include…

    2025年7月3日
    5
  • 叙事传输的说服机制_简述传输层实现可靠传输措施

    叙事传输的说服机制_简述传输层实现可靠传输措施博文《PUSCH上行跳频(1)-Type1频率跳频》里提到了为什么要使用PUSCH跳频,以及详细介绍了Type1方式的跳频,本文继续这个话题,介绍Type2方式的跳频。1.采用PUSCH跳频时需要注意的问题在上行子帧中,PUCCH信道处于带宽的高低两侧,或者说位于频带的边缘,PUSCH信道则位于带宽的中间。PUCCH信道也以RB对为基本单位,每个RB在频域上是12个子载波,时域上是1个时隙。需要注意PUCCH信道每个RB对的两个RB位置:第一个时隙的PUCCH信道位于带宽的低频位置,第二个时隙的

    2025年6月11日
    21
  • MySQL timestampdiff()函数[通俗易懂]

    MySQL timestampdiff()函数[通俗易懂]下面说明了TIMESTAMPDIFF函数的语法。TIMESTAMPDIFF(unit,begin,end);TIMESTAMPDIFF函数返回begin-end的结果,其中begin和end是DATE或DATETIME表达式。TIMESTAMPDIFF函数允许其参数具有混合类型,例如,begin是DATE值,end可以是DATETIME值。如果使用DATE值,则TIMESTAMPDIFF函…

    2022年6月11日
    45

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号