如何给自己的网站添加背景音乐

 时间:2026-02-14 05:53:19

1、以下我用记事本,简单的介绍一下如何给网页添加背景音乐。

首先新建一个TXT文档。这里以demo.txt为例。

如何给自己的网站添加背景音乐

2、更改demo.txt文件的扩展名txt为html,我们就获得了demo.html文件。即通常的网页文件格式。

如何给自己的网站添加背景音乐

3、右击该文件—打开方式—记事本,用记事本打开该文件。

如何给自己的网站添加背景音乐

4、添加基本的网页结构:

<html>

<head>

<title>如何添加背景音乐?</title>

</head>

<body>

<!--背景音乐添加在这里-->

<!--开始-->

<!--结束-->

</body>

</html>

如果您是初学者,不建议直接复制我的代码。

如何给自己的网站添加背景音乐

5、建议新建一个文件夹,把demo.html和你要作为背景音乐的歌曲放在同一个文件夹。我们以一首背景音乐为例子,大家举一反三。

如何给自己的网站添加背景音乐

6、在 HTML 中播放声音的方法有很多种。

最好的 HTML 解决方法

实例

<audio controls="controls" height="100

  <source src="小果 - 蒲公英的梦想.mp3" type="audio/mp3" />

  <source src="小果 - 蒲公英的梦想.ogg" type="audio/ogg" />

  <embed height="100

</audio>

上面的例子使用了两个不同的音频格式。HTML5 <audio> 元素会尝试以 mp3 或 ogg 来播放音频。如果失败,代码将回退尝试 <embed> 元素。

如何给自己的网站添加背景音乐

7、保存并关闭,双击打开demo.html,网页内出现了一个播放器。点击播放按钮,即可以播放音乐。

如何给自己的网站添加背景音乐

8、如果你不需要这个播放器,而是直接播放音乐。可以这样修改。

把 controls="controls" 去掉。这个意思是不要控件。

添加 autoplay="autoplay",意思是打开网页时自动播放。

然后,保存关闭,打开demo.html,悠扬的音乐就播放出来了。

  • VS2013怎么设置启动时若没有用户代码则发出警告
  • 如何修改电脑鼠标指针的移动速度教程
  • VF9.0重命名文件
  • 如何在待办清单系统中为任务自由排序?
  • 百度100块现金红包怎么拿
  • 热门搜索
    手抄报装饰简笔画 认识大自然的手抄报 读书小报手抄报图片 关于数学知识的手抄报 阳光心理手抄报 文明用语手抄报 感恩节手抄报图片大全 礼仪手抄报内容 书香满园手抄报 争做文明使者手抄报