<!DOCTYPE html>
<html lang="th">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Happy Valentine ❤️</title>
<style>
body {
text-align: center;
font-family: Arial, sans-serif;
background-color: #ffe6e6;
margin: 0;
padding: 50px;
}
.container {
background: white;
padding: 30px;
border-radius: 15px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
display: inline-block;
}
h1 {
color: #ff4d4d;
}
button {
background-color: #ff4d4d;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 18px;
margin-top: 20px;
}
button:hover {
background-color: #cc0000;
}
#message {
font-size: 20px;
color: #333;
margin-top: 20px;
}
</style>
</head>
<body>
<div class="container">
<h1>Happy Valentine's Day ❤️</h1>
<p>กดปุ่มนี้เพื่อรับข้อความหวานๆ จากใจ</p>
<button onclick="showMessage()">กดเลย!</button>
<p id="message"></p>
</div>
<script>
function showMessage() {
const messages = [
"รักเธอที่สุดในโลก ❤️",
"เธอคือทุกอย่างของฉัน 💖",
"ขอบคุณที่อยู่ข้างๆ กันเสมอ 💕",
"ไม่มีใครแทนที่เธอได้เลย 💓",
"อยู่กับฉันตลอดไปนะ 💘",
"เธอคือเหตุผลที่ฉันยิ้มได้ทุกวัน 😊",
"Happy Valentine’s Day! รักเธอมากๆ ❤️"
];
const randomIndex = Math.floor(Math.random() * messages.length);
document.getElementById("message").textContent = messages[randomIndex];
}
</script>
</body>
</html>
PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9InRoIj4KPGhlYWQ+CiAgICA8bWV0YSBjaGFyc2V0PSJVVEYtOCI+CiAgICA8bWV0YSBuYW1lPSJ2aWV3cG9ydCIgY29udGVudD0id2lkdGg9ZGV2aWNlLXdpZHRoLCBpbml0aWFsLXNjYWxlPTEuMCI+CiAgICA8dGl0bGU+SGFwcHkgVmFsZW50aW5lIOKdpO+4jzwvdGl0bGU+CiAgICA8c3R5bGU+CiAgICAgICAgYm9keSB7CiAgICAgICAgICAgIHRleHQtYWxpZ246IGNlbnRlcjsKICAgICAgICAgICAgZm9udC1mYW1pbHk6IEFyaWFsLCBzYW5zLXNlcmlmOwogICAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZlNmU2OwogICAgICAgICAgICBtYXJnaW46IDA7CiAgICAgICAgICAgIHBhZGRpbmc6IDUwcHg7CiAgICAgICAgfQogICAgICAgIC5jb250YWluZXIgewogICAgICAgICAgICBiYWNrZ3JvdW5kOiB3aGl0ZTsKICAgICAgICAgICAgcGFkZGluZzogMzBweDsKICAgICAgICAgICAgYm9yZGVyLXJhZGl1czogMTVweDsKICAgICAgICAgICAgYm94LXNoYWRvdzogMCAwIDEwcHggcmdiYSgwLDAsMCwwLjEpOwogICAgICAgICAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7CiAgICAgICAgfQogICAgICAgIGgxIHsKICAgICAgICAgICAgY29sb3I6ICNmZjRkNGQ7CiAgICAgICAgfQogICAgICAgIGJ1dHRvbiB7CiAgICAgICAgICAgIGJhY2tncm91bmQtY29sb3I6ICNmZjRkNGQ7CiAgICAgICAgICAgIGNvbG9yOiB3aGl0ZTsKICAgICAgICAgICAgcGFkZGluZzogMTBweCAyMHB4OwogICAgICAgICAgICBib3JkZXI6IG5vbmU7CiAgICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDVweDsKICAgICAgICAgICAgY3Vyc29yOiBwb2ludGVyOwogICAgICAgICAgICBmb250LXNpemU6IDE4cHg7CiAgICAgICAgICAgIG1hcmdpbi10b3A6IDIwcHg7CiAgICAgICAgfQogICAgICAgIGJ1dHRvbjpob3ZlciB7CiAgICAgICAgICAgIGJhY2tncm91bmQtY29sb3I6ICNjYzAwMDA7CiAgICAgICAgfQogICAgICAgICNtZXNzYWdlIHsKICAgICAgICAgICAgZm9udC1zaXplOiAyMHB4OwogICAgICAgICAgICBjb2xvcjogIzMzMzsKICAgICAgICAgICAgbWFyZ2luLXRvcDogMjBweDsKICAgICAgICB9CiAgICA8L3N0eWxlPgo8L2hlYWQ+Cjxib2R5PgogICAgPGRpdiBjbGFzcz0iY29udGFpbmVyIj4KICAgICAgICA8aDE+SGFwcHkgVmFsZW50aW5lJ3MgRGF5IOKdpO+4jzwvaDE+CiAgICAgICAgPHA+4LiB4LiU4Lib4Li44LmI4Lih4LiZ4Li14LmJ4LmA4Lie4Li34LmI4Lit4Lij4Lix4Lia4LiC4LmJ4Lit4LiE4Lin4Liy4Lih4Lir4Lin4Liy4LiZ4LmGIOC4iOC4suC4geC5g+C4iDwvcD4KICAgICAgICA8YnV0dG9uIG9uY2xpY2s9InNob3dNZXNzYWdlKCkiPuC4geC4lOC5gOC4peC4oiE8L2J1dHRvbj4KICAgICAgICA8cCBpZD0ibWVzc2FnZSI+PC9wPgogICAgPC9kaXY+CgogICAgPHNjcmlwdD4KICAgICAgICBmdW5jdGlvbiBzaG93TWVzc2FnZSgpIHsKICAgICAgICAgICAgY29uc3QgbWVzc2FnZXMgPSBbCiAgICAgICAgICAgICAgICAi4Lij4Lix4LiB4LmA4LiY4Lit4LiX4Li14LmI4Liq4Li44LiU4LmD4LiZ4LmC4Lil4LiBIOKdpO+4jyIsCiAgICAgICAgICAgICAgICAi4LmA4LiY4Lit4LiE4Li34Lit4LiX4Li44LiB4Lit4Lii4LmI4Liy4LiH4LiC4Lit4LiH4LiJ4Lix4LiZIPCfkpYiLAogICAgICAgICAgICAgICAgIuC4guC4reC4muC4hOC4uOC4k+C4l+C4teC5iOC4reC4ouC4ueC5iOC4guC5ieC4suC4h+C5hiDguIHguLHguJnguYDguKrguKHguK0g8J+SlSIsCiAgICAgICAgICAgICAgICAi4LmE4Lih4LmI4Lih4Li14LmD4LiE4Lij4LmB4LiX4LiZ4LiX4Li14LmI4LmA4LiY4Lit4LmE4LiU4LmJ4LmA4Lil4LiiIPCfkpMiLAogICAgICAgICAgICAgICAgIuC4reC4ouC4ueC5iOC4geC4seC4muC4ieC4seC4meC4leC4peC4reC4lOC5hOC4m+C4meC4sCDwn5KYIiwKICAgICAgICAgICAgICAgICLguYDguJjguK3guITguLfguK3guYDguKvguJXguLjguJzguKXguJfguLXguYjguInguLHguJnguKLguLTguYnguKHguYTguJTguYnguJfguLjguIHguKfguLHguJkg8J+YiiIsCiAgICAgICAgICAgICAgICAiSGFwcHkgVmFsZW50aW5l4oCZcyBEYXkhIOC4o+C4seC4geC5gOC4mOC4reC4oeC4suC4geC5hiDinaTvuI8iCiAgICAgICAgICAgIF07CiAgICAgICAgICAgIGNvbnN0IHJhbmRvbUluZGV4ID0gTWF0aC5mbG9vcihNYXRoLnJhbmRvbSgpICogbWVzc2FnZXMubGVuZ3RoKTsKICAgICAgICAgICAgZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoIm1lc3NhZ2UiKS50ZXh0Q29udGVudCA9IG1lc3NhZ2VzW3JhbmRvbUluZGV4XTsKICAgICAgICB9CiAgICA8L3NjcmlwdD4KPC9ib2R5Pgo8L2h0bWw+
<!DOCTYPE html>
<html lang="th">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Happy Valentine ❤️</title>
<style>
body {
text-align: center;
font-family: Arial, sans-serif;
background-color: #ffe6e6;
margin: 0;
padding: 50px;
}
.container {
background: white;
padding: 30px;
border-radius: 15px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
display: inline-block;
}
h1 {
color: #ff4d4d;
}
button {
background-color: #ff4d4d;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 18px;
margin-top: 20px;
}
button:hover {
background-color: #cc0000;
}
#message {
font-size: 20px;
color: #333;
margin-top: 20px;
}
</style>
</head>
<body>
<div class="container">
<h1>Happy Valentine's Day ❤️</h1>
<p>กดปุ่มนี้เพื่อรับข้อความหวานๆ จากใจ</p>
<button onclick="showMessage()">กดเลย!</button>
<p id="message"></p>
</div>
<script>
function showMessage() {
const messages = [
"รักเธอที่สุดในโลก ❤️",
"เธอคือทุกอย่างของฉัน 💖",
"ขอบคุณที่อยู่ข้างๆ กันเสมอ 💕",
"ไม่มีใครแทนที่เธอได้เลย 💓",
"อยู่กับฉันตลอดไปนะ 💘",
"เธอคือเหตุผลที่ฉันยิ้มได้ทุกวัน 😊",
"Happy Valentine’s Day! รักเธอมากๆ ❤️"
];
const randomIndex = Math.floor(Math.random() * messages.length);
document.getElementById("message").textContent = messages[randomIndex];
}
</script>
</body>
</html>