親愛的XXX
今天是xxx（例如：520），我特別想對你說：
?我愛你！
在這個特別的日子里，我希望我們可以一起走過更多的曲折坎坷。
親愛的，你愿意跟我一起走下去嗎？
YES<html>
<head>
<title>HTML5動態表白頁面</title>
<style type="text/css">
body{
background-color: #ffffcc;
font-family: "Microsoft YaHei";
text-align: center;
padding-top: 50px;
}
h1{
font-size: 48px;
color: red;
margin-bottom: 20px;
}
#love{
font-size: 60px;
color: pink;
margin-bottom: 20px;
-webkit-animation: heart 1s infinite ease-in-out;
animation: heart 1s infinite ease-in-out;
}
@-webkit-keyframes heart{
0%{
transform: scale(1);
}
50%{
transform: scale(1.5);
}
100%{
transform: scale(1);
}
}
@keyframes heart{
0%{
transform: scale(1);
}
50%{
transform: scale(1.5);
}
100%{
transform: scale(1);
}
}
p{
font-size: 28px;
color: #666666;
margin-bottom: 20px;
}
a{
font-size: 36px;
color: white;
background-color: red;
padding: 20px 50px;
border-radius: 10px;
text-decoration: none;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
a:hover{
background-color: #ff3366;
color: white;
transform: scale(1.2);
}
</style>
</head>
<body>
<h1>親愛的XXX</h1>
<p>今天是xxx（例如：520），我特別想對你說：</p>
<span id="love">?</span>
<p>我愛你！</p>
<p>在這個特別的日子里，我希望我們可以一起走過更多的曲折坎坷。</p>
<p>親愛的，你愿意跟我一起走下去嗎？</p>
<a href="#">YES</a>
</body>
</html>