Simple HTML Game: Test Your Luck!
<!DOCTYPE html>
<html>
<head>
<title>Simple HTML Game: Test Your Luck!</title>
<style>
body {
background-color: #F7F7F7;
text-align: center;
}
h1 {
color: #4169E1;
font-size: 2em;
font-family: sans-serif;
}
button {
background-color: #4169E1;
color: white;
padding: 0.5em;
border-radius: 0.3em;
font-family: sans-serif;
font-size: 1em;
}
.result {
font-family: sans-serif;
font-size: 1.25em;
}
</style>
</head>
<body>
<h1>Simple HTML Game: Test Your Luck!</h1>
<p>Click the button to see if you're lucky!</p>
<button onclick='playGame()'>Play the game!</button>
<div id='result' class='result'></div>
<script>
function playGame() {
const randomNumber = Math.floor(Math.random() * 10) + 1;
let result = document.getElementById('result');
if (randomNumber % 2 === 0) {
result.innerHTML = 'You win!';
} else {
result.innerHTML = 'You lose!';
}
}
</script>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/lmlX 著作权归作者所有。请勿转载和采集!