如何在CSS文件中插入背景音乐?

html-css050

如何在CSS文件中插入背景音乐?,第1张

embed

示例:<embed src="your.mid">

(二)、属性设置:

1、自动播放:

语法:autostart=true、false

说明:该属性规定音频或视频文件是否在下载完之后就自动播放。

true:音乐文件在下载完之后自动播放;

false:音乐文件在下载完之后不自动播放。

示例:<embed src="your.mid" autostart=true>

<embed src="your.mid" autostart=false>

2、循环播放:

语法:loop=正整数、true、false

说明:该属性规定音频或视频文件是否循环及循环次数。

属性值为正整数值时,音频或视频文件的循环次数与正整数值相同;

属性值为true时,音频或视频文件循环;

属性值为false时,音频或视频文件不循环。

示例:<embed src="your.mid" autostart=true loop=2>

<embed src="your.mid" autostart=true loop=true>

<embed src="your.mid" autostart=true loop=false>

3、面板显示:

语法:hidden=ture、flase

说明:该属性规定控制面板是否显示,默认值为flase。

ture:隐藏面板;

flase:显示面板。

示例:<embed src="your.mid" hidden="ture">

<embed src="your.mid" hidden="no">

4、开始时间:

语法:starttime=mm:ss(分:秒)

说明:该属性规定音频或视频文件开始播放的时间。未定义则从文件开头播放。

示例:<embed src="your.mid" starttime="00:10">

5、音量大小:

语法:volume=0-100之间的整数

说明:该属性规定音频或视频文件的音量大小。未定义则使用系统本身的设定。

示例:<embed src="your.mid" volume="10">

有2种方式:

<embed src='音频地址' loop="false" width="长" height="宽" autostart="false" style="float: right">   //指向右浮动

<p style="position: relative">

<embed src='音频地址' loop="false" width="长" height="宽" autostart="false"

style='position:absolutetop:0pxright: 0px'>

</p>   //这种是固定在右边的格式

<body>

<audio autoplay loop id="bgSound">

    <source src="音频地址">

</audio>

<input id="bgSwitch" checked type="checkbox"/>播放背景音乐

<script>

    bgSwitch.onchange = function(){

       if(this.checked){

           bgSound.play()

       }else {

           bgSound.pause()

       }

    }

    //如果当前背景音乐在播放,则body的背景颜色变为鲜艳的红色,否则变为淡淡的红色——使用onplay和onpause的事件监听

    bgSound.onplay = function(){

        document.body.style.backgroundColor="#f00"

    }

    bgSound.onpause =function(){

        document.body.style.backgroundColor = "#fcc"

    }

</script>

</body>