snake/index.html at master · SunQQQ/snake · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>贪吃蛇</title>
    <link href="css/tetris.css" type="text/css" rel="stylesheet">
    <meta name="keywords" content="贪食蛇，原生javascript，javascript实现贪吃蛇">
    <meta name="description" content="原生javascript编写贪吃蛇">
    <link rel="icon" href="img/Snake.png">
</head>
<body>
<div class="content">
    <table id="chessboard"></table>
    <div class="right">
        <div class="rules">
            <div class="title">
                <span>用户名：</span>
                <span class="edit">编辑</span>
            </div>
            <div class="score name">0</div>
        </div>
        <div class="rules">
            <div class="title">得分：</div>
            <div class="score">0</div>
        </div>
        <div class="rules">
            <div class="title">
                <span>用时：</span>
                <span class="unit">(秒)</span>
            </div>
            <div class="score time">0</div>
        </div>
        <div class="rules">
            <div class="title">游戏规则：</div>
            <!-- <p>按任意方向键，开始游戏，通过吃蛋获取得分。</p> -->
            <p>使用方向键，控制蛇吃蛋得分。</p>
        </div>
        <div class="rules">
            <div class="title">英雄榜：</div>
            <div class="ranking">
                <p>
                    <span class="user-name">比克大魔王</span>：
                    <span class="score-num">230分</span>
                </p>
                <p>
                    <span class="user-name">张可</span>：
                    <span class="score-num">120分</span>
                </p>
                <p>
                    <span class="user-name">王耀辉</span>：
                    <span class="score-num">100分</span>
                </p>
                <p>
                    <span class="user-name">我是第一</span>：
                    <span class="score-num">100分</span>
                </p>
                <p>
                    <span class="user-name">多啦A梦</span>：
                    <span class="score-num">120分</span>
                </p>
            </div>
        </div>
    </div>
</div>

<!--弹窗-->
<div class="wrapper">
    <div class="dialog-box">
        <div class="box-header">
            编辑用户名
        </div>
        <div class="head-button">
            <img src="img/cancel.png">
        </div>
        <div class="box-content">
            大侠可留下你的昵称，冲刺最高记录
            <div class="sq-input">
                <input>
            </div>
        </div>
        <div class="box-btns">
            <button class="leave-Message">我要吐槽</button>
            <button class="skip">跳过</button>
            <button class="adminUrl">游戏记录</button>
            <button class="conform">确认</button>
        </div>
    </div>
</div>

<script src="js/snake.js"></script>
<script src="js/messageBox.js"></script>
<script src="js/index.js"></script>
</body>
</html>