HTML网页自动播放背景音乐和全屏背景图代码

HTML网页自动播放背景音乐的代码

  • 背景音乐代码及分析
  • 代码的应用
  • 背景图代码及分析
  • 下期更新预报

背景音乐代码及分析

能使网站上自动循环背景音乐代码如下:

<audio src="music.mid" autostart="true" loop="true" hidden="true">

具体的分解解析如下:

  • 1、src=”music.mid” 指的是背景音乐的路径,最好能使用相对路径,以便上传的时候不会出错。

    这里的music.mid跟网页文件在同一个目录下,所以直接输入文件名即可。

  • 2、autostart=”true” 指的是当音乐文件载入后是否自动播放。

    其中有两个逻辑选项,true和false,这里设定为true,也就是表示表示自动播放。

  • 3、loop=”true” 指的是音乐文件是否循环播放,也可以指定循环播放的次数。

    比如loop=”3”表示重复播放3次,loop=”-1”和loop=”true”都表示无限循环。

  • 4、hidden=”true” 指的是控制面板是否隐藏。true表示隐藏控制面板,false为显示控制面板。

代码的应用

1、找到写好的自动循环的背景音乐代码

<embed src="XXX.mp3" autostart="true" loop="true" hidden="true"></embed>

2、将其插入到网站的…之间,保存设置。
在这里插入图片描述

保存后就大功告成了,不仅仅可以听到背景音乐,如果使用主流浏览器,还能看到标签栏上有背景音乐播放的图标。

背景图代码及分析

能使网站上铺满全屏背景图代码如下:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<style>
		body{
			background-image: url(img/untitled.png);
			background-repeat: no-repeat;
			background-size: cover;
		}
	</style>
	<body>
		
	</body>
</html>

在这里插入图片描述
保存后就大功告成了.

下期更新预报

手把手教会你做属于自己的网站

  • 📢博客主页:孤客网络科技工作室官方账号
  • 📢欢迎点赞👍收藏⭐️留言 📝如有错误敬请指正!
  • 📢本文由孤客原创,若侵权联系作者,首发于CSDN博客
  • 📢停下休息的时候不要忘了别人还在奔跑,希望大家抓紧时间学习,全力奔赴更好的生活💻

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/577059.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

python使用opencv对图像的基本操作(2)

13.对多个像素点进行操作&#xff0c;使用数组切片方式访问 img[i,:] img[j,:] #将第j行的数值赋值给第i行 img[-2,:]或img[-2] #倒数第二行 img[:,-1] #最后一列 img[50:100,50:100] #50-100行&#xff0c;50-100列&#xff08;不包括第100行和第100列&#xff09; img[:100…

怎么用PHP语言实现远程控制电器

怎么用PHP语言实现远程控制电器呢&#xff1f; 本文描述了使用PHP语言调用HTTP接口&#xff0c;实现控制电器&#xff0c;通过控制电器的电源线路来实现电器控制。 可选用产品&#xff1a;可根据实际场景需求&#xff0c;选择对应的规格 序号设备名称厂商1智能WiFi通断器AC3统…

Ubuntu16.04搭建webrtc服务器

本人查阅无数资料,历时3周搭建成功 一、服务器组成 AppRTC 房间+Web服务器 https://github.com/webrtc/apprtcCollider 信令服务器,在AppRTC源码里CoTurn coturn打洞+中继服务器 Nginx 服务器,用于Web访问代理和Websocket代理。AppRTC 房间+Web服务器使用python+js语言 App…

Elcomsoft iOS Forensics Toolkit: iPhone/iPad/iPod 设备取证工具包

天津鸿萌科贸发展有限公司是 ElcomSoft 系列取证软件的授权代理商。 Elcomsoft iOS Forensics Toolkit 软件工具包适用于取证工作&#xff0c;对 iPhone、iPad 和 iPod Touch 设备执行完整文件系统和逻辑数据采集。对设备文件系统制作镜像&#xff0c;提取设备机密&#xff08…

【机器学习】集成学习:强化机器学习模型与创新能的利器

集成学习&#xff1a;强化机器学习模型预测性能的利器 一、集成学习的核心思想二、常用集成学习方法Bagging方法Boosting方法Stacking方法 三、集成学习代表模型与实现四、总结与展望 在大数据时代的浪潮下&#xff0c;机器学习模型的应用越来越广泛&#xff0c;而集成学习作为…

Centos7 yum报错 Could not resolve host: mirrorlist.centos.org

yum install报如下错误 应该是网络问题&#xff0c;检查是不是这个文件配置错了导致连不上网 /etc/sysconfig/network-scripts/ifcfg-ens33 注意里面的DNS配置 可以在服务器ping一下百度 ping wwww.baidu.com

QX2303L50F输入电压0.7V~5V输出电压5V非同步DCDC最大输出电流800mA

前言 外围较简单&#xff0c;价格较低&#xff0c;小电流输出时&#xff0c;最低启动电压0.8V 输出电压有多种&#xff0c;封装有多种 参考价格约0.2元 QX2303典型应用电路图 QX2303封装 QX2303丝印 1.概述 QX2303 系列产品是一种高效率、低纹波、工作频率高的 PFM 升压 DC-…

战胜DALL·E 3和 Midjourney的开源模型来了——playground-v2.5

这是首次超越闭源AI模型的开源时刻。Playground AI 前不久宣布Playground v2.5正式开源。Playground v2.5 是美学质量方面最先进的开源模型&#xff0c;特别关注增强的颜色和对比度、改进的多纵横比生成以及改进的以人为中心的精细细节。并且在美学质量方面树立了新标准&#x…

从单按键状态机思维扫描引申到4*4矩阵按键全键无冲扫描,一步一步教,超好理解,超好复现(STM32程序例子HAL库)

目前大部分代码存在的问题 ​ 单次只能对单个按键产生反应&#xff1b;多个按键按下就难以修改&#xff1b;并且代码耦合度较高&#xff0c;逻辑难以修改&#xff0c;对于添加长按&#xff0c;短按&#xff0c;双击的需求修改困难。 解决 16个按键按下无冲&#xff0c;并且代…

AIGC技术带来的安全与隐私问题探讨

如何看待AIGC技术&#xff1f; 简介&#xff1a;探讨AIGC技术的发展现状和未来趋势。提醒&#xff1a;在发布作品前&#xff0c;请把不需要的内容删掉。 方向一&#xff1a;技术应用 机遇和挑战 AIGC国内场景应用图谱 方向二&#xff1a;伦理与风险 垄断与隐私风险 AI民主化诉…

Linux--MyMiniTry--Vim

首先下载好vim,我们可以按以下的方式进行光标的移动&#xff08;也可以回车进行换行&#xff09; &#xff08;--> 进入教程&#xff09; &#xff08;初始的时候没有文本&#xff0c;你怎么按都没有用&#xff09; &#xff08;我们要先按 i &#xff0c;进行插入文本才…

前端单元测试的艺术:专业化策略与Vue项目高效实践指南

单元测试是软件开发中的基石&#xff0c;尤其对于前端领域&#xff0c;它为保证代码质量、提升开发效率、强化项目稳定性提供了不可或缺的支持。本文将深入剖析单元测试的核心理念&#xff0c;揭示其在前端开发中的独特价值&#xff0c;并提炼出一套专业且高效的实践策略&#…

全志ARM-官方库SDK安装和验证

进入界面&#xff0c;输入以下指令 git clone https://github.com/orangepi-xunlong/wiringOP //下载源码 cd wiringOP //进入文件夹 sudo ./build clean //清除编译信息 sudo ./build …

电容的理论基础

目录 1.电容的本质&#xff1a; 2.电容量的大小 2.1电容的单位 2.2电容的决定式 ​编辑3.电容的特点 5.电容器的类型 6.电容实际的电路模型 7.安装方法 ​编辑8.电容值 9.电容的耐压、封装 10.阻抗-频率特性 11.频率特性 12.等效串联电组ESR 13.电容器的温度特性…

[C++基础学习]----03-程序流程结构之选择结构详解

前言 本篇都是在自学C基础知识的基础上&#xff0c;加上本身理解所完成的&#xff0c;为了便于记录学习情况&#xff0c;使用更加容易理解的话术描述出来&#xff0c;方便使用。 在C程序中&#xff0c;选择结构&#xff08;也称为条件结构&#xff09;用于根据特定的条件执行不…

python 使用flask_httpauth和pyjwt实现登录权限控制

最近需要用到&#xff0c;学习了一下记录 首先安装依赖 pip install Flask-HTTPAuth pyjwt passlib Welcome to Flask-HTTPAuth’s documentation! — Flask-HTTPAuth documentation Welcome to PyJWT — PyJWT 2.8.0 documentation Passlib 1.7.4 documentation — Passl…

Unity类银河恶魔城学习记录15-1,2 p153 Audio Manager p154 Audio distance limiter

Alex教程每一P的教程原代码加上我自己的理解初步理解写的注释&#xff0c;可供学习Alex教程的人参考 此代码仅为较上一P有所改变的代码 【Unity教程】从0编程制作类银河恶魔城游戏_哔哩哔哩_bilibili AudioManager.cs using System.Collections; using System.Collections.Gen…

Grafana 系列|Grafana 监控 TDengine集群

Grafana 监控 TDengine集群有两种方式&#xff1a; 一、 taosKeeper监控 TDengine 通过 taosKeeper 将服务器的 CPU、内存、硬盘空间、带宽、请求数、磁盘读写速度等信息定时写入指定数据库。TDengine 还将重要的系统操作&#xff08;比如登录、创建、删除数据库等&#xff0…

OpenHarmony语言基础类库【@ohos.util.HashSet (非线性容器HashSet)】

HashSet基于[HashMap]实现。在HashSet中&#xff0c;只对value对象进行处理。 HashSet和[TreeSet]相比&#xff0c;HashSet中的数据无序存放&#xff0c;即存放元素的顺序和取出的顺序不一致&#xff0c;而TreeSet是有序存放。它们集合中的元素都不允许重复&#xff0c;但Hash…

八国语言50种海外电子游戏源码 海外游戏开发BTC虚拟币支付 外国电子游艺 游戏源码交易平台 搭建教程

全新海外版的游戏竞猜玩法带搭建教程 系统支持八国语言&#xff0c;50种游戏&#xff0c;支持 Paypal、人工充值、BTC多种支付 源码下载&#xff1a;https://download.csdn.net/download/m0_66047725/89105597 更多资源下载&#xff1a;关注我。