当然,这是一个基于PHP的猜数字游戏的示例,游戏规则:游戏会生成一个1到100之间的随机数,你需要在输入框中猜数字,然后提交你的猜测。系统会根据你的猜测告诉你是猜大了还是猜小了,直到你猜中为止。接下来你可以尝试在你的网页服务器上运行这个代码,然后打开游戏页面进行游戏。希望你会喜欢这个小游戏!

<!DOCTYPE html>
<html>
<head>
<title>猜数字游戏</title>
</head>
<body>
<?php
// 生成随机数
$number = rand(1, 100);
$guess = $_GET['guess'] ?? null;
// 判断猜测结果
if ($guess != null) {
if ($guess > $number) {
echo "太大啦!";
} elseif ($guess < $number) {
echo "太小啦!";
} else {
echo "恭喜你,猜对了!";
}
}
?>
<h1>猜数字游戏</h1>
<form method="GET" action="">
<label for="guess">请输入一个1-100之间的数字:</label>
<input type="number" id="guess" name="guess" min="1" max="100">
<input type="submit" value="猜!">
</form>
</body>
</html>优化版:要求页面显示10个数字,其中一个为正确答案,每一次给玩家5分,玩家每猜一次(点击页面显示的数字),扣一分,如果消耗掉5分,玩家还没猜出准确答案。则为玩家挑战失败,否则为玩家挑战成功。
<!DOCTYPE html>
<html>
<head>
<title>猜数字游戏</title>
<style>
body {
font-family: Arial, sans-serif;
}
h1 {
text-align: center;
margin-bottom: 20px;
}
.container {
max-width: 500px;
margin: 0 auto;
padding: 20px;
}
.numbers {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-bottom: 20px;
}
.number {
width: 80px;
height: 80px;
margin: 5px;
border: 1px solid #ccc;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
font-size: 24px;
}
.number:hover {
background-color: #ccc;
}
.score {
text-align: center;
margin-bottom: 20px;
}
.result {
text-align: center;
font-size: 24px;
font-weight: bold;
}
</style>
</head>
<body>
<?php
// 生成随机数
$number = rand(1, 10);
$score = $_GET['score'] ?? 5;
$guess = $_GET['guess'] ?? null;
// 判断猜测结果
if ($guess != null) {
if ($guess == $number) {
echo "<div class='result'>恭喜你,猜对了!</div>";
echo "<div class='result'>挑战成功!</div>";
exit;
}
$score -= 1;
if ($score == 0) {
echo "<div class='result'>挑战失败!</div>";
exit;
}
echo "<div class='result'>$guess不是正确答案,还剩下$score次机会。</div>";
}
?>
<div class="container">
<h1>猜数字游戏</h1>
<div class="score">当前剩余分数:<strong><?php echo $score; ?></strong></div>
<div class="numbers">
<?php for ($i = 1; $i <= 10; $i++) {
echo "<div class='number' onclick='guessNumber($i)'>$i</div>";
} ?>
</div>
<form method="GET" action="">
<input type="hidden" id="guess" name="guess">
<input type="hidden" id="score" name="score" value="<?php echo $score; ?>">
</form>
</div>
<script>
function guessNumber(number) {
document.getElementById('guess').value = number;
document.getElementById('score').form.submit();
}
</script>
</body>
</html>