猜数字html

2023-03-22 13:21:04 浏览数 (1)

数字游戏: html <!DOCTYPE html> <html> <head> <title>猜数字游戏</title> <style> body { font-family: Arial, sans-serif; } .guess { font-size: 36px; color: red; padding: 16px; background-color: white; border: 1px solid black; border-radius: 4px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); } .guess:hover { opacity: 0.8; } .correct { font-weight: bold; } .incorrect { font-weight: bold; color: red; } </style> </head> <body> <h1>猜数字游戏</h1> <label for="guess">请猜一个数字:</label> <input type="text" id="guess" name="guess" placeholder="输入一个数字" required> <button onclick="guess()">猜一下</button> <p id="correct"></p> <p id="incorrect"></p> <script> var guess = document.getElementById("guess"); var correct = document.getElementById("correct"); var incorrect = document.getElementById("incorrect"); guess.addEventListener("input", function() { correct.innerHTML = "你猜对了!"; incorrect.innerHTML = "再试一次!"; }); guess.

0 人点赞