Scribd
Upload
21 views2 pages

!doctype HTML

birthday wish web page

Uploaded by

Abhioday Shawarn
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
21 views2 pages

!doctype HTML

birthday wish web page

Uploaded by

Abhioday Shawarn
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Happy Birthday!</title>
<style>
body {
margin: 0;
font-family: 'Arial', sans-serif;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
background: linear-gradient(120deg, #ff9a9e, #fad0c4);
color: #fff;
text-align: center;
}
.container {
animation: fadeIn 2s ease-in-out;
}
h1 {
font-size: 3rem;
margin: 0;
}
p {
font-size: 1.5rem;
margin: 10px 0;
}
.heart {
font-size: 4rem;
animation: pulse 1.5s infinite;
}
@keyframes fadeIn {
from { opacity: 0; transform: scale(0.8); }
to { opacity: 1; transform: scale(1); }
}
@keyframes pulse {
0%, 100% { transform: scale(1); color: #f08080; }
50% { transform: scale(1.2); color: #ff6f61; }
}
.button {
margin-top: 20px;
padding: 10px 20px;
font-size: 1.2rem;
border: none;
border-radius: 5px;
background-color: #ff6f61;
color: #fff;
cursor: pointer;
transition: background 0.3s ease;
}
.button:hover {
background-color: #ff4444;
}
</style>
</head>
<body>
<div class="container">
<h1>🎉 Happy Birthday, [Name]! 🎉</h1>
<p>Wishing you a day filled with love, laughter, and joy!</p>
<p class="heart">❤</p>
<button class="button" onclick="alert('Make a wish! 🎂')">Click for a
surprise</button>
</div>
</body>
</html>

You might also like