html第三课歌词同步音画代码
【推荐下载】HTML5实现歌词同步
HTML5 实现歌词同步
2015/06/12 10240 HTML5 的最强大之处莫过于对媒体文件的处理，如利用一个简单的vedio 标签就可以实现视频播放。
类似地,在HTML5 中也有对应的处理音
频文件的标签，那就是audio 标签
在线Demo
audio 标签实现一个audio 标签非常简单，对应的html 代码如下：
audio id=“player”src=“music/我在人民广场吃炸鸡.mp3”autoplay controls /audio 上述代码不需要一行js 脚本就能实现音乐播放。
其中有三个常用的属性，
分别为：音频源文件，是否自动播放以及是否显示播放器控件。
由于没有任何ui 的
展现，audio 标签在chrome 的默认风格如下图:
可以看出，一个基本的播放器还包括了显示当前时间，播放，暂停，快进快退
等功能。
这些功能都决定了如何很好的实现歌词同步（后续介绍）。
既然这么容易就就能播放音乐，那作为一项前端的技术，audio 标签在各个浏览
器中的兼容性又是怎样的呢？Browser Compatibility
可以看出，各大浏览器对audio 标签基本功能都支持，只是在细微的特性上表
现不一，但是这些基本的功能已经足已做出一个好的播放器。
一般标准的lyric 文件是由[时间]内容的tag 标签组成，如下图：
为了更精确的展现每个字在每句歌词中的时间，又出现了特殊的歌词形式，如下：
这种歌词的格式的最好例子就是QRC 歌词文件（如QQ 音乐播放器）：
为了描述简单，本文仅以最简单的lyric 格式作为说明，讲解如何分离歌词进行。
【网页特效代码-其他特效】音乐和歌词同步的网页特效代码
/*for(var j=0;j<lytext.length;j++)
{
document.getElementById("lyr").innerHTML+=lytime[j]+lytext[j]+"<br>";
}*/
scrollBar();
}
function sToArray(str)//解析如“[02:02][00:24]没想到是你”的字符串前放入数组
}
else if(t<lytime[lytime.length-1])//数组的最后一个要舍弃
div1.innerHTML+=lytext[k]+"<br>";
}
}
else//加上数组的最后一个
{
for(var j=0;j<lytext.length-1;j++)
div1.innerHTML+=lytext[j]+"<br>";
type="application/x-oleobject">
<param name="FileName" value="/2008-09-02/13/d930d8efa0b39f0c9c90bf4bc7010586.mp3">
<param n"1">
<param name="AllowScan" value="0">
html歌词同步滚动实现思路深入解析
html歌词同步滚动实现思路深⼊解析效果展⽰跟随歌曲时间同步滚动歌词,并实现⾼亮效果⾃动播放改变进度总体思路1. 获取歌词2. 解析歌词3. 打印歌词4. 同步歌词1. 获取歌词⽤ ajax 和⽹易云的 api 获取的歌词资源.(涉及到跨域问题,这⾥不赘述,主要讲同步功能的思路)2. 解析歌词步骤:1. 新建数组 lrcArray2. 提取歌词 lrcGet3. ⽤换⾏符把字符串 lrcGet分 割为数组 lrc4. 遍历 lrc其中,遍历 lrc 后的处理步骤过滤提取和转化时间提取歌词添加进数组 lrcArray控制台返回的 lrcGetlrcjsvar lrcArray = [];//新建数组,⽤于存放歌词var lrcGet = data.lrc.lyric;//提取歌词// console.log(lrcGet);var lrc = lrcGet.split('\n');// console.log(lrc);$.each(lrc, function(i, item) {//过滤空⽩⽂本if (item.split(']')[1] == "" || item == "" || item.indexOf('作曲') !== -1 || item.indexOf('作词') !== -1) {return true;}//转化时间var timeStr = item.substring(item.indexOf("[") + 1, item.indexOf("]"));var min = parseInt(timeStr.split(':')[0]) * 60;var sec = parseFloat(timeStr.split(':')[1]);var time = parseFloat((min + sec).toFixed(2));//添加进数组lrcArray.push({t: time,c: item.substring(item.indexOf(']') + 1)});});3. 打印歌词控制台返回处理后的数组lrcArray如下:html代码<div class="lyrics"><ul class="lyricsList"></ul></div>js//显⽰歌词//打印全部在页⾯var html = "";$.each(lrcArray, function(i, v) {html += '<li>' + v.c + '</li>';});$('.lyricsList').append(html);4. 同步歌词$('#audio')[0].ontimeupdate = function() {$.each(lrcArray, function(i, v) {if ($('#audio')[0].currentTime >= lrcArray[i].t) {$('.lyricsList').css('margin-top', '');//避免进度变动时数值产⽣混乱$('.lyricsList li').eq(i).addClass('highlight');$('.lyricsList li').eq(i).siblings().removeClass('highlight');if (i > 2) {$('.lyricsList').css('margin-top', (-i + 2) * 30 + 'px');}}});};思路: audio 时间进度每更新⼀次,就同步⼀次该数组,把audio 的当前时间和数组每⼀项的时间作⽐较.当检测到前者⼤于或等于后者,就⾼亮和滚动对应的歌词.关于⾼亮的思路以代码的⾓度:以index(这⾥对应 i)为桥梁,只要符合条件,对应的 li 就会先被⾼亮后被消除⾼亮,⼀直到最后⼀个符合条件的 lrcArray[i].t⾥的 i对应的 li被⾼亮,此时只会⾼亮⽽不会消除,等到 i+1 符合条件,i 的 先⾼亮后消除,i+1只⾼亮,以此迭代下去.从样式上看:由于代码执⾏飞速,以致⾁眼不会看到先⾼亮后消除的过程,只会看到最后⼀个被⾼亮.关于滚动的思路从第⼀⾏歌词开始滚动,定格在第三⾏html代码<div class="lyrics"><ul class="lyricsList"></ul></div>css 样式.lyrics {height: 32%;padding-top: 8px;overflow: hidden;}.lyrics .lyricsList {margin: 0;padding: 0;display: flex;flex-direction: column;align-items: center;justify-content: center;}.lyrics .lyricsList li {height: 30px;line-height: 15px;font-size: 12px;}js 代码var index = 0;$('#audio')[0].ontimeupdate = function() {if (this.currentTime >= parseFloat(lrcArray[index].t)) {$('.lyricsList li').eq(index).addClass('highlight');$('.lyricsList li').eq(index).siblings().removeClass('highlight');if (index > 2) {//添加 css 样式以实现滚动效果$('.lyricsList').css('margin-top', -(index - 2) * 30 + 'px');}index++;}};js 滚动思路分析图从 i>2 起设置margin-top负值.当滚动到 i=3对应的 li 节点后，margin-top 的值每次增加⼀个负的 li 的⾏⾼，即-30px，以实现推动效果。
HTML5网页音乐播放器的示例代码
HTML5⽹页⾳乐播放器的⽰例代码本⽂介绍了HTML5⽹页⾳乐播放器的⽰例代码，分享给⼤家，具体如下：1功能介绍HTML5中推出了⾳视频标签，可以让我们不借助其他插件就可以直接播放⾳视频。
下⾯我们就利⽤H5的audio标签及其相关属性和⽅法来制作⼀个简单的⾳乐播放器。
主要包括以下⼏个功能：1、播放暂停、上⼀⾸和下⼀⾸2、调整⾳量和播放进度条3、根据列表切换当前歌曲先来看⼀下最终的完成效果：这个⾳乐播放器的结构主要分为三部分：歌曲信息、播放器和播放列表，我们重点介绍⼀下播放器部分。
⾸先在播放器中放三个audio标签⽤于播放：<audio id="music1">浏览器不⽀持audio标签<source src="media/Beyond - 光辉岁⽉.mp3"></source></audio><audio id="music2">浏览器不⽀持audio标签<source src="media/Daniel Powter - Free Loop.mp3"></source></audio><audio id="music3">浏览器不⽀持audio标签<source src="media/周杰伦、费⽟清 - 千⾥之外.mp3"></source></audio>下⾯的播放列表也对应三个audio标签：<div id="playList"><ul><li id="m0">Beyond-光辉岁⽉</li><li id="m1">Daniel Powter-Free Loop</li><li id="m2">周杰伦、费⽟清-千⾥之外</li></ul></div>接下来我们就开始逐步实现上⾯提到的功能吧，先来完成播放和暂停功能，在按下播放按钮时我们要做到进度条随歌曲进度前进，播放时间也逐渐增加，同时播放按钮变成暂停按钮，播放列表的样式也对应改变。
HTML 第三课 歌词同步音画代码
HTML第三课：歌词同步音画代码画儿编写画儿向来喜欢歌词同步音画，今天我们来共同学习这个内容。
见效果：荷花颂一、《荷花颂》音画贴代码解析：1、主题图片部分（蓝色部分代码），这里选用了一张1000*650的图片，在图片参数width和height上要对应填写（width（宽）="1000" height（高）="650"）。
<html><head><TITLE>荷花颂</TITLE><META. HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312"></head><body LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0><style>v\:*{behavior.:url(#default#VML)}v\:textpath{font-family:宋体;font-size:16px;v-text-align:left}</style><TABLE WIDTH=1000 BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD><IMGSRC="/attachments/2009/07/29/4812_200907 292312131.jpg（图片地址）" WIDTH=1000 HEIGHT=650ALT=""></TD></TR></TABLE>2、歌词同步时间标签和音乐地址（红色部分代码），歌词同步时间标签用中括号表示，例：[02:11.10]02表示分钟，11表示秒，10表示时间微调，意义不大。
htmlaudioplayer用法
htmlaudioplayer用法HTML Audio Player的用法HTML Audio Player是一种在网站上嵌入音频文件的方法，通过它可以添加音乐、音效或其他声音到网页中。
以下是HTML Audio Player的用法介绍：1. HTML标签要在网页中添加音频，可以使用HTML中的`<audio>`标签。
具体的HTML标签结构如下：```<audio controls><source src="audiofile.mp3" type="audio/mp3"><source src="audiofile.ogg" type="audio/ogg">Your browser does not support the audio element.</audio>```在上述代码中，`<source>`标签用于指定音频文件的源文件和文件类型，`src`属性用于指定音频文件的路径，`type`属性用于指定音频文件的MIME类型。
`controls`属性用于显示音频播放器的控件，比如播放/暂停按钮、音量调节等。
最后的文字"Your browser does not support the audio element."是在用户的浏览器不支持HTML5音频元素时显示的备用文本。
2. 支持的音频格式不同的浏览器支持不同的音频格式，为了确保音频在各个浏览器上都能播放，可以提供不同格式的音频文件。
常见的音频格式包括MP3和OGG，上述代码中的两个`<source>`标签分别指定了MP3和OGG格式的音频文件路径。
浏览器会自动选择支持的格式进行播放，如果不支持任何一种格式，则会显示备用文本。
3. 其他属性和方法除了上述介绍的基本用法外，HTML Audio Player还提供了其他一些属性和方法来实现更多的功能。
HTML中插入音乐方法及调整播放器代码
背景音乐代码1. 如何贴rm,ra,ram类型的音乐，代码如下：<embed width="0" height="0" type="audio/x-pn-realaudio-plugin" autostart="true" controls="ControlPanel" src="/uploads/01.rm";>2. 如何贴midi,asf,wma,asx类型的音乐，代码如下：<embed autostart="true" loop="-1" controls="ControlPanel" width="0" height="0" src="/uploads/01.mid";>只需要把整段代码copy复制到文章中(编辑文章的时请先点击HTML代码模式再粘贴代码，否则这段代码会以文本形式显示出来，不能被葱?，用你喜欢及可用的音乐文件的URL(网址)代替上面红色显示的音乐地址代码就可以了。
造成音乐不能成功播放的大多数原因：A：音乐文件错误，有可能这个文件本身就不是音乐的文件，只是一个普通的HTML页面。
B：音乐文件地址错误，这个音乐文件根本不存在。
C：没有安装相关的播放软件。
测试的办法：请把音乐文件地址在IE栏输入，如果提示你保存，保存的文件类型是rm、ram、midi等的文件即是音乐文件。
如果打开这个文件是自动播放音乐或显示其他内容的，则不是。
添加带音乐的flash，然后在弹出窗口输入你的FLASH地址，注意后戳名为：http://xxxxx.xxxx.swf，大小可以调整为，1*1，这样可以在不显示FA LSH的情况下播放音乐，但是记住要为自动播放的，不要找那种需要按开始的FLASH加入一段在线音乐播放代码，推荐使用：<IFRAME marginHeight=0 src="/play.htm"; frameBorder=0 noResize width=540 scr olling=no height=25> 将此代码放入网站合适地方，将24小时不间断放歌，次代码由清风网络电台提供以下代码由[秋天的风]提供：首先打开我的文章，进入编辑状态，选择HTML格式然后就可以输入了，下面我们来看代码，首先来看第一种，比较简单的：<bgsound src="/blog/”url"” loop=-1>“url”依然是路径名,loop表示循环数，-1表示始终循环来看第二种：<EMBED src="music.mid" autostart="bool" loop="n" width="m" height="k">其中各个属性的含义如下：SRC：音乐文件路径（以下可选）AUTOSTART：音乐文件上传完后自动播放，TRUE为播放，FALSE为否LOOP：设置循环TRUE为自动循环，FALSE为不循环，数值为次数WIDTH，HEIGHT为播放控制面板的宽和高，其余的属性有：volume：取值范围为"0-100"，设置音量，默认为系统本身的音量starttime："分：秒"，设置歌曲开始播放的时间，如，starttime="00:10"，从第10秒开始播放endtime："分：秒"，设置歌曲结束播放的时间controls ：控制面板的外观controls="console/smallconsole/playbutton/ pausebutton/stopbutton/volumelever" ?console 正常大小的面板?smallconsole 较小的面板?playbutton 显示播放按钮?pausebutton 显示暂停按钮?stopbutton 显示停止按钮?volumelever 显示音量调节按钮hidden：为true时可以隐藏面板。
html音画基本代码
< P align=center><IMG src="图片地址"></p>
< P align=center><IMG src="图片地址"></p>
< P align=center><IMG src="图片地址"></p>
<TBODY>
<TR>
<TD> <embed style="LEFT: 0px; WIDTH: 600px; POSITION: relative; TOP: 0px;height:400px" src="flash地址" type="application/x-shockwave-flash" quality="high" menu="false" wmode="transparent" ></embed> <பைடு நூலகம்TD>
<A href="音乐地址" target=_blank><FONT size=4 color=#8484ff>DOWNLOAD</FONT></A></center>
</td></tr></table>
例：<embed style="POSITION: absolute; WIDTH: 460px; HEIGHT: 350px; TOP: 550px; LEFT: 345px" type="application/octet-stream" src="http://ftp.oolove.com/youyuan/flash/花瓣2.swf" quality="high" wmode="transparent" />
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
HTML第三课：歌词同步音画代码画儿编写画儿向来喜欢歌词同步音画，今天我们来共同学习这个内容。
见效果：荷花颂一、《荷花颂》音画贴代码解析：1、主题图片部分（蓝色部分代码），这里选用了一张1000*650的图片，在图片参数width和height上要对应填写（width（宽）="1000" height（高）="650"）。
<html><head><TITLE>荷花颂</TITLE><META. HTTP-EQUIV="Content-Type" CONTENT="text/html;charset=gb2312"></head><body LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0><style>v\:*{behavior.:url(#default#VML)}v\:textpath{font-family:宋体;font-size:16px;v-text-align:left}</style><TABLE WIDTH=1000 BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD><IMG SRC="（图片地址）" WIDTH=1000 HEIGHT=650 ALT=""></TD> </TR></TABLE>2、歌词同步时间标签和音乐地址（红色部分代码），歌词同步时间标签用中括号表示，例：[02:]02表示分钟，11表示秒，10表示时间微调，意义不大。
歌词同步时间表示当前歌词在音乐中开始的时间。
另外，前面部分参数：代码ti表示标题，ar表示歌手，al表示专辑。
by表示作者等等。
LRC文件可以到专门的LRC搜索网站查找，如：也可以百度查找，或使用千千静听播放某首歌曲的时候千千静听自动到他服务器上搜索。
歌词同步时间标签也可以自己用千千静听播放，然后在歌词上记录时间，再填写到时间标签上，自己做比较好，时间可以做到比较标准。
由于歌曲版本不同或歌唱者不同，同步时间有差异，自己做就更有必要。
<xmp id=xLyric style=display:none>[ti:荷花颂][ar:童丽][al:对话Ⅱ古筝与童丽的故事][offset:0][by:☆画儿☆音画☆☆][by:noni99][offset:500][00:]专辑：对话Ⅱ古筝与童丽的故事[00:]童丽 - 荷花颂[00:]作词：作曲：甘肃民歌[00:]☆画儿☆音画☆☆[00:]--------[02:][00:]万里无云好晴天[02:][00:]啊……[02:][00:]看那荷花在水面[02:][02:][00:][00:]啊…[02:][02:][00:][00:]千万朵花儿数着它好[02:][02:][00:][00:]人人见了心喜欢[02:][01:]--[02:][01:]荷花朵朵放光彩[02:][01:]啊……[02:][01:]薄雾青纱头上戴[03:][03:][01:][01:]那啊…[03:][03:][01:][01:]微风轻轻迎面吹来[03:][03:][01:][01:]荷花点头笑颜开[03:][01:]----蓝天高绿水长荷花朝太阳风吹千里香青山含笑碧波荡漾看那荷花正开放[04:][04:]</xmp>3、以下为显示歌词脚本的代码：<script>=function(){return false}start()function start(){browser_ini()timer_ini()emv_ini()(oo("xLyric").innerHTML)("歌曲载入中，请耐心等待...","l") ("（音乐地址）")}function emv_ini(){var l={}lrc_ini()歌词显示位置（莲色部分代码），作为模板使用，只要修改紫色部分代码中的2个参数就能够调整歌词显示位置，如本例的划横线部分，分别表示距左边框和顶端的距离，边调试边看效果，直到歌词显示位置满意。
l="<div id=bxEmvstyle=position:absolute;left:20;top:139;width:600;height:560> "l+="<divstyle=position:absolute;left:0;top:0;width:600;height:560;></ div>"l+="<div id=bxEmvScreenstyle=position:absolute;overflow:hidden;left:19;top:26;width: 480;height:360;>"l+="</div>"l+="</div>"l+="<objectclassid=clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95 id=mplayer width=0 height=0 style=display:none></object>"insHtm,l)=function(url){oo("mplayer").FileName=url;oo("mplayer").Pla y()}=function(){var mPos=,n=var n1,o,len,w,per,n0,n1n1=n<"|")*1:9999if(n1<mPos){++n++if(n==0)[n].slice("|"),"l")if(n<[n+1].slice("|"),n%2==1"l":"r")}if(n>=0){n0=[n].slice(0,"|")n1="|"):4o=oo("bxCaption_"+(n%2==0"l":"r")+"_cover") len=!=""*1:n1-n0per=(mPos-n0)/lenfor(i=;i<1;i+={per1=(o,i)if(per1>=per)break}}}("()")}function lrc_ini(){={}=function(str,pos){return(0,pos).replace(/[^\x00-\xff]/g," ").length/(/[^\x00-\xff]/ g," ").length}=function(str){var l,a,i,ad,n,jstr=(/\|/g,"").replace(/\r\n/g,"\n")str=(/\[(\d\d)\:(\d\d)\.(\d\d)\]/g,function($0,$1,$2,$3){r eturn ($1*60+$2*1+$3/100)+"|"})a=("\n")=new Array()for(i=0;i<;i++){ad=("|")for(j=1;j<;j++){"|"+ad[])}}=-1sortIndex=0sortDir=1}=function(obj,pos){var a=,zoom=,pos1=pos*zoomvar a,i,adfor(i=0;i<;i++){ad=aif(pos<=ad[0])continueif(pos>ad[0]&&pos<=ad[1])pos1+=(zoom*ad[2]-zoom)*(pos-ad[0]) else{pos1+=(zoom*ad[2]-zoom)*(ad[1]-ad[0]) }return pos1}=function(str,pos){var word=str,style=""var x,y,l,w,w1,o,a,i,adif(/^\<.+\>/.test(str)){word=(">")style=(1).slice(0,">")}w=(/[^\x00-\xff]/g," ").length*13+2 if(pos=="l"){x=40y=285}else{x=520-wy=315l="<div id=bxCaption_"+pos+"style='position:absolute;left:"+x+";top:"+y+";width:"+w+";hei ght:23;overflow:hidden'>"l+="<v:curve to=700,1 strokecolor=black strokeweight=3 style=position:absolute;top:14>"l+="<v:path textpathok=t /><v:textpath n=t string='"+word+"' /></v:curve>"l+="<v:curve to=700,1 strokecolor=white fillcolor=white strokeweight=1 style=position:absolute;top:14>"l+="<v:path textpathok=t /><v:textpath n=t string='"+word+"' /></v:curve>"l+="</div>"l+="<div id=bxCaption_"+pos+"_cover width="+w+"style=position:absolute;left:"+x+";top:"+y+";width:0;height:2 3;overflow:hidden>"l+="<v:curve to=700,1 strokecolor=white strokeweight=3 style=position:absolute;top:14>"l+="<v:path textpathok=t /><v:textpath n=t string='"+word+"' /></v:curve>"l+="<v:curve to=700,1 strokecolor=blue fillcolor=blue strokeweight=1 style=position:absolute;top:14>"l+="<v:path textpathok=t /><v:textpath n=t string='"+word+"' /></v:curve>"l+="</div>"odel("bxCaption_"+pos)odel("bxCaption_"+pos+"_cover")insHtm("bxEmvScreen",l)o=oo("bxCaption_"+pos+"_cover")=("time")=new Array()len1=1a=(";")for(i=0;i<;i++){if(!/(\d+):(\d+)/.test(a))continueif(/(\d+)-(\d+):(\d+)/.test(a)){ad=/(\d+)-(\d+):(\d+)/.exec(a)ad[0]=(word,ad[1]-1)ad[1]=(word,ad[2]*1)ad[2]=ad[3]}else{ad=/(\d+):(.+)/.exec(a)ad[0]=(word,ad[1]-1)ad[1]=(word,ad[1]*1)}len1+=(ad[1]-ad[0])*(ad[2]-1)}=1/len1}}function browser_ini(){ ="IE")>0="IE ")>0(/(^[\s]*)|([\s]*$)/g,"")}","};return (s2+this+s2).indexOf(s2+s1+s2)>-1true:false} "".slicev,b1=typeof(n1)=="number",b2=typeof(n2)=="number";if(!b1|| typeof(n2)=="string"){v=eval("("+(b1n1:(n1)+(n2==null1:0)+(n1 )==-1:0))+(n2==null"":(b2n2:(n2)==-1"":","+(n2))))+")")}else{ v=isIE5&&n1<0&&n2==null:eval("(n1"+(n2==null"":","+n2)+")")}r eturn v}";"))return 1;var a=(new RegExp("(^|;)"+str+":[^;]*"));return a==null||str==""(def==null"":def):a[0].replace(";","").slice+ 1)}=function(obj){return typeof(obj)=="string"(obj):obj}=function(op,html,inEnd){op=oo(op);if(isIE){(inEnd==null"be foreend":"afterbegin",html)}else{varr="op."+(inEnd==null"appendChild":"insertBefore")+"(html),"); }}=function(obj){if(oo(obj)!=null){oo(obj).(oo(obj))}}if(!isIE){false;do if(node==this){returntrue}while(node={return false}}"srcElement",function(){var node=;while!=1){node=}return node})"toElement",function(){return })}}function timer_ini(){={}=null=""=0=function(key){if(!";")){+=key+";"}}=function(key){=";","")}=function(){eval++=("()",10)}()}function sortFoo(v1,v2){var s1=("|")[sortIndex],s2=("|")[sortIndex]if(!isNaN(s1)&&!isNaN(s2)){s1*=1s2*=1}return (s1==s20:(s1>s21:-1))*sortDir}</script>4、flash语言：红色部分<EMBED style="LEFT: 650px; POSITION: absolute; TOP:0px" align=right src= （flash地址）width=400 height=300type=application/octet-stream ; quality="high"wmode="transparent"><EMBED style="LEFT: 50px; POSITION: absolute; TOP:150px" align=right src=（flash地址）width=600 height=300type=application/octet-stream ; quality="high"wmode="transparent"><EMBED style="LEFT: 400px; POSITION: absolute; TOP: 350px" align=right src=（flash地址） width=400 height=320type=application/octet-stream ; quality="high"wmode="transparent">5、结尾<META. content="MSHTML " name=GENERATOR></HEAD><TBODY><TR><TD></TD></TR></TBODY></TABLE></DIV></BODY></HTML>二、如何制作歌词同步音画：下面是歌词同步音画代码，替换其中地址部分就可以了。