首先简单准备一下所需要的材料（完整代码在文尾）
1.一首动听的歌曲
2.一个新建的文本
3.还有公主殿下的一张美图
接下来开始敲代码
<title>Hatsune Miku -sekai deichiban'ohimesama</title>title 元素在所有 HTML/XHTML 文档中都是必需的。
title 元素能够：
<style>
p.miku {
text-align: center;
color: #39C5BB;
font-size: 300%;
}
</style>再利用css来描述接下来下文要显示的字体，并定义为miku类
其中#39C5BB（葱绿）为官方定义的初音未来配色
<body background="miku.jpg">
<p class="miku">世界第一公主殿下</p>定义网页的背景图片以及输出语句“世界第一公主殿下”（ワールドイズマイン）
<div style="position:fixed; bottom:0; right:0;">
<audio controls="controls">
<source src="世界第一公主殿下.mp3" type="audio/mpeg">
</audio>
</div><audio> 元素是一个 HTML5 元素，在 HTML 4 中是非法的，但在所有浏览器中都有效。
最后看下成品
点击播放按钮即可开始播放音乐
最后附上所有代码
<!DOCTYPE html>
<html>
<head>
<title>Hatsune Miku -sekai deichiban'ohimesama</title>
<style>
p.miku {
text-align: center;
color: #39C5BB;
font-size: 300%;
}
</style>
</head>
<body background="miku.jpg">
<p class="miku">世界第一公主殿下</p>
<div style="position:fixed; bottom:0; right:0;">
<audio controls="controls">
<source src="世界第一公主殿下.mp3" type="audio/mpeg">
</audio>
</div>
</body>
</html>版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
