小游戏-猜数字 -一个渣渣

效果图：

游戏说明：

浏览器随机生成0-100以内的一个数字，在输入框中填写你猜测的数字，猜测范围是0-100以内的正整数哦！

有十次机会猜测，且在这十次猜测中都会对每次的猜测数字进行提示。。

代码

html

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>猜数字小游戏</title>
 6     <link rel="stylesheet" href="style.css">
 7 </head>
 8 <body>
 9 <div class="content start">
10     <h1>猜数字小游戏</h1>
11     <h4>请在输入框中填写你猜测的数字，猜测范围是0-100以内的正整数哦！</h4>
12     <div class="cont1">
13         <label for="clientNum"><b>输入数字：</b></label>
14         <input type="text" id="clientNum">
15         <button>监测</button>
16         <p></p>
17     </div>
18     <div class="cont2">
19         <b>猜测提示：</b>
20         <span></span>
21         <!-- <span class="info-up">你的猜测高了</span>
22         <span class="info-down">你的猜测高了</span> -->
23     </div>
24     <div class="cont3">
25         <b>已测数字：</b>
26         <div class="cont3-box">
27             <!-- <span class="old-num">2</span>
28             <span class="old-num">122</span>
29             <span class="old-num">122</span>
30             <span class="old-num">122</span>
31             <span class="old-num">122</span>
32             <span class="old-num">122</span>
33             <span class="old-num">122</span>
34             <span class="old-num">122</span>
35             <span class="old-num">122</span>
36             <span class="old-num">122</span> -->
37         </div>
38     </div>
39     <div class="cont4">
40         <b>猜测结果：</b>
41         <span></span>
42         <!-- <span class="error">错误！</span>
43         <span class="success">恭喜答对了！</span>
44         <span class="over">game over！</span> -->
45     </div>
46     <div class="cont5">
47         <span class="over">sorry， 你的十次机会用完了。 game over！</span>
48         <br>
49         <input type="reset" value="重来" class="reset">
50     </div>
51 </div>
52     <script src="common.js"></script>
53 </body>
54 </html>

转载自原文链接, 如需删除请联系管理员。

原文链接：小游戏-猜数字，转载请注明来源！