首页 前端知识 html生日祝福网页制作(粉色主题

html生日祝福网页制作(粉色主题

2024-01-30 20:01:45 前端知识 前端哥 374 997 我要收藏
以下是一个HTML生日祝福网页的例子,使用粉色主题:
复制
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>生日祝福网页</title>
<style>
body {
background-color: #fce4ec;
font-family: Arial, sans-serif;
text-align: center;
padding: 20px;
}
h1 {
color: #f48fb1;
}
p {
color: #ff80ab;
font-size: 18px;
line-height: 24px;
margin-bottom: 20px;
}
.cake {
width: 200px;
margin: 0 auto;
}
.message {
color: #f06292;
font-weight: bold;
}
</style>
<h1>生日快乐!</h1>
<img class="cake" src="cake.png" alt="生日蛋糕">
<p class="message">
祝你在新的一年里,天天开心,事事顺利!
</p>
<p>
<a href="https://www.example.com">点击这里</a> 查看更多祝福。
</p>
复制

在这个例子中,网页的背景颜色为粉色(#fce4ec),标题使用了淡粉色(#f48fb1)的字体颜色,正文和消息使用了亮粉色(#ff80ab)的字体颜色。蛋糕图片被居中显示,点击“点击这里”可以跳转到更多祝福的链接。

你可以将代码复制到一个文本编辑器中,将蛋糕图片替换为你自己想要的图片,然后将文件保存为.html扩展名,即可在浏览器中打开查看效果。记得将cake.png替换为你的图片文件名,并将图片文件与HTML文件放置在同一个目录下。

转载请注明出处或者链接地址:https://www.qianduange.cn//article/869.html
标签
AI生成
评论
还可以输入200
共0条数据,当前/页
发布的文章

我喜欢别人的老婆怎么办

2024-02-12 00:02:58

如何治疗hpv

2024-02-12 00:02:27

如何治疗灰指甲

2024-02-12 00:02:07

如何治疗前列腺炎

2024-02-12 00:02:42

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!