用html制作一个宣传哆啦a梦电影的网页要求附带音乐
时间: 2023-09-29 12:06:49 浏览: 140
以下是一个简单的宣传哆啦A梦电影的网页,附带有音乐:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>宣传哆啦A梦电影</title>
<style>
body {
background-color: #f7f7f7;
font-family: Arial, sans-serif;
}
#header {
background-color: #f2b71a;
color: #fff;
padding: 20px;
text-align: center;
}
#movie-poster {
display: block;
margin: 0 auto;
max-width: 100%;
}
#summary {
margin: 30px auto;
max-width: 800px;
text-align: center;
}
#trailer {
margin: 30px auto;
max-width: 800px;
text-align: center;
}
#trailer-video {
display: block;
margin: 0 auto;
max-width: 100%;
}
#footer {
background-color: #f2b71a;
color: #fff;
padding: 20px;
text-align: center;
}
</style>
</head>
<body>
<!-- Header -->
<header id="header">
<h1>宣传哆啦A梦电影</h1>
</header>
<!-- Movie Poster -->
<img id="movie-poster" src="https://cdn.jsdelivr.net/gh/ChrisLee0211/CDN/img/doraemon-movie-poster.jpg" alt="哆啦A梦电影海报">
<!-- Summary -->
<div id="summary">
<h2>影片简介</h2>
<p>本片讲述了哆啦A梦和小伙伴们的一系列奇妙冒险故事,他们穿梭时空、探寻未知、追寻梦想、感悟友情,在这个充满惊奇和温暖的故事中,你将收获无限的感动和欢笑。</p>
</div>
<!-- Trailer -->
<div id="trailer">
<h2>预告片</h2>
<video id="trailer-video" src="https://cdn.jsdelivr.net/gh/ChrisLee0211/CDN/video/doraemon-movie-trailer.mp4" controls></video>
</div>
<!-- Footer -->
<footer id="footer">
<p>© 2021 哆啦A梦电影宣传网页</p>
<audio controls autoplay>
<source src="https://cdn.jsdelivr.net/gh/ChrisLee0211/CDN/audio/doraemon-movie-theme.mp3" type="audio/mpeg">
您的浏览器不支持音频播放。
</audio>
</footer>
</body>
</html>
```
这个网页包括了电影海报、影片简介、预告片和版权信息等内容,并且在页脚处附带了一首哆啦A梦电影的主题曲。你可以将图片、视频和音频链接换成自己喜欢的资源地址,也可以调整样式和布局来实现自己想要的效果。
阅读全文