-
Notifications
You must be signed in to change notification settings - Fork 6
/
Copy pathindex.html
172 lines (168 loc) · 6.02 KB
/
index.html
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
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>16人格测试程序员版</title>
<link rel="stylesheet" href="./css/nav.css" />
<link rel="stylesheet" href="./css/index.css" />
<link rel="stylesheet" href="./css/footer.css" />
</head>
<body>
<nav>
<a href="index.html">职业人格测试</a>
<a href="personalitys.html">查看所有结果</a>
<a href="https://github.com/Littlefean/CodingPersonality" target="_blank"
>开源地址</a
>
</nav>
<header>
<h1>16人格测试（程序员版）</h1>
<p>做你自己，诚实回答，找出你的职业人格类型。</p>
<p>尝试发掘自己的学习潜力，看看自己更擅长学哪个方面。</p>
</header>
<!-- 题目 -->
<main></main>
<button class="submit">查看结果</button>
<article class="result" style="display: none">
<h2>你的最终人格</h2>
<div class="final">
<h2 class="tag"></h2>
<h2 class="name"></h2>
<img src="" alt="人格图片" />
<section class="range-area">
<p class="AV">
抽象 <span class="left"></span> - 交互 <span class="right"></span>
</p>
<div class="AV">
<span class="left"></span>
<span class="right"></span>
</div>
<p class="FE">
经验 <span class="left"></span> - 探索 <span class="right"></span>
</p>
<div class="FE">
<span class="left"></span>
<span class="right"></span>
</div>
<p class="RQ">
速度 <span class="left"></span> - 质量 <span class="right"></span>
</p>
<div class="RQ">
<span class="left"></span>
<span class="right"></span>
</div>
<p class="PC">
性能 <span class="left"></span> - 功能 <span class="right"></span>
</p>
<div class="PC">
<span class="left"></span>
<span class="right"></span>
</div>
</section>
<h3>编程性格介绍</h3>
<p class="describe"></p>
<h3>格言</h3>
<p class="motto"></p>
<h3>优势</h3>
<p class="advantage"></p>
<h3>劣势</h3>
<p class="inferiority"></p>
<h3>建议</h3>
<p class="recommendation"></p>
</div>
<h2>你的潜在人格</h2>
<div class="potential">
<h2 class="tag"></h2>
<h2 class="name"></h2>
<img src="" alt="人格图片" />
<section class="range-area">
<p class="AV">
抽象 <span class="left"></span> - 交互 <span class="right"></span>
</p>
<div class="AV">
<span class="left"></span>
<span class="right"></span>
</div>
<p class="FE">
经验 <span class="left"></span> - 探索 <span class="right"></span>
</p>
<div class="FE">
<span class="left"></span>
<span class="right"></span>
</div>
<p class="RQ">
速度 <span class="left"></span> - 质量 <span class="right"></span>
</p>
<div class="RQ">
<span class="left"></span>
<span class="right"></span>
</div>
<p class="PC">
性能 <span class="left"></span> - 功能 <span class="right"></span>
</p>
<div class="PC">
<span class="left"></span>
<span class="right"></span>
</div>
</section>
<h3>编程性格介绍</h3>
<p class="describe"></p>
<h3>格言</h3>
<p class="motto"></p>
<h3>优势</h3>
<p class="advantage"></p>
<h3>劣势</h3>
<p class="inferiority"></p>
<h3>建议</h3>
<p class="recommendation"></p>
</div>
<h2>你的彩蛋人格</h2>
<div class="easter-egg">
<h2 class="tag"></h2>
<h2 class="name"></h2>
<img src="" alt="人格图片" />
<h3>彩蛋人格介绍</h3>
<p class="describe"></p>
<h3>格言</h3>
<p class="motto"></p>
<h3>优势</h3>
<p class="advantage"></p>
<h3>劣势</h3>
<p class="inferiority"></p>
<h3>建议</h3>
<p class="recommendation"></p>
</div>
</article>
<footer class="attention">
<h3>注意事项</h3>
<p>整活项目，目前仅供娱乐，分类有不合理的地方，模型较为简单，误差难免，科学程度还没有证实</p>
<p>实际上关注维度比例数值比关注四个字母的结果可能更有意义。当有一个维度在40%~60%之间徘徊的时候，这个维度就不一定准确</p>
<p>不要因为测试结果是什么，就给自己打标签，进入自证陷阱</p>
<p>
编程思维习惯是会随着时间成长和变化的，可多次测试，也可以看出来这段时间自己的编程思维变化。
</p>
<p>up主经历有限，一些职业可能疏漏了。实际上疏漏的职业也许能放入这16类型中，如果不能放入或者发现这个职业和很多人格重叠，恭喜你发现了这个设计的漏洞，请在
<a href="https://www.bilibili.com/video/BV1Wk4y1S74f" target="_blank">b站视频评论区</a>分享你的发现</p>
<h3>支持作者</h3>
<p>
如果你觉得这个项目有趣，可以点击
<a
href="https://github.com/Littlefean/CodingPersonality"
target="_blank"
>开源地址</a
>
进入github点点star
</p>
<p>
或者关注作者的
<a href="https://space.bilibili.com/480804525" target="_blank"
>B站up主</a
>账号，我会经常做一些有趣的小项目
</p>
</footer>
</body>
<script src="./js/static.js"></script>
<script src="./js/question.js"></script>
<script src="./js/index.js"></script>
</html>