利用CSS+HTML制作一个网页版贺卡
时间: 2024-01-23 16:03:40 浏览: 58
以下是一个简单的CSS HTML制作的网页版贺卡:
```html
<!DOCTYPE html>
<html>
<head>
<title>祝福贺卡</title>
<style>
body {
background-color: #f5f5f5;
}
.container {
margin: 0 auto;
width: 600px;
background-color: #fff;
padding: 20px;
box-shadow: 0px 0px 10px #aaa;
font-family: Arial, sans-serif;
}
h1 {
font-size: 36px;
font-weight: bold;
text-align: center;
margin-bottom: 30px;
color: #f44336;
}
.message {
font-size: 24px;
line-height: 1.6;
text-align: center;
margin-bottom: 30px;
color: #333;
}
.signature {
font-size: 18px;
font-style: italic;
text-align: right;
color: #777;
}
</style>
</head>
<body>
<div class="container">
<h1>祝福贺卡</h1>
<div class="message">
<p>亲爱的XXX:</p>
<p>在这个特别的日子里,祝您身体健康,工作顺利,家庭和睦,生活快乐!</p>
<p>谨以此贺卡献上,祝您一生平安!</p>
</div>
<div class="signature">
<p>XXX敬上</p>
<p>2021年1月1日</p>
</div>
</div>
</body>
</html>
```
效果图:
![贺卡效果图](https://i.loli.net/2021/01/11/7VZsLhUHtnJWYRl.png)
阅读全文