-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
156 lines (142 loc) · 5.55 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
<!DOCTYPE HTML>
<!--
Read Only by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<title>春卷的博客</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link href="https://tenapi.cn/qqimg/?qq=2744881984" rel="icon" type="image/x-ico">
<link rel="stylesheet" href="assets/css/main.css" />
<link href='assets/js/static/pio.css' rel='stylesheet' type='text/css'/>
</head>
<body class="is-preload">
<div class="pio-container left">
<div class="pio-action"></div>
<canvas id="pio" width="190" height="200"></canvas>
</div>
<!-- Header -->
<section id="header">
<header>
<span class="image avatar"><img src="https://tenapi.cn/qqimg/?qq=2744881984" alt="" /></span>
<h1 id="logo"><a href="#">春卷</a></h1>
<p>找我有事吗<br />
他最近好像在钓鱼</p>
</header>
<nav id="nav">
<ul>
<li><a href="#one" class="active">首页</a></li>
<li><a href="#two">技术栈</a></li>
<li><a href="#three">案例</a></li>
<li><a href="#four">留言</a></li>
</ul>
</nav>
<footer>
<ul class="icons">
<li><a href="#" class="icon brands fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="#" class="icon brands fa-facebook-f"><span class="label">Facebook</span></a></li>
<li><a href="#" class="icon brands fa-instagram"><span class="label">Instagram</span></a></li>
<li><a href="https://github.com/black-noe" class="icon brands fa-github"><span class="label" >Github</span></a></li>
<li><a target="_blank" href="http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=k6Gkp6erq6Kqq6fT4uK98Pz_" class="icon solid fa-envelope"><span class="label">Email</span></a></li>
</ul>
</footer>
</section>
<!-- Wrapper -->
<div id="wrapper">
<!-- Main -->
<div id="main">
<!-- One -->
<section id="one">
<div class="image main" data-position="center">
<img src="https://tenapi.cn/acg" alt="" />
</div>
<div class="container">
<header class="major">
<h2>个人博客</h2>
<p>记录学习技术交流的地方<br />
一个炫技的地方,作品会陆续发布<a href="https://tenapi.cn/qq/?qq=2744881984">联系我</a>.</p>
</header>
<p class="daily"></p>
</div>
</section>
<!-- Two -->
<section id="two">
<div class="container">
<h3>技术栈</h3>
<p>个人目前掌握</p>
<ul class="feature-icons">
<li class="icon solid fa-code">Vue2</li>
<li class="icon solid fa-cubes">less/saass</li>
<li class="icon solid fa-book">h5</li>
<li class="icon solid fa-coffee">javascript/jquery</li>
<li class="icon solid fa-bolt">node.js</li>
<li class="icon solid fa-users">three.js</li>
</ul>
</div>
</section>
<!-- Three -->
<section id="three">
<div class="container">
<h3>案例</h3>
<a href="./three/demo4/index.html" target="_blank">基于three实现VR全景地图</p>
<div class="features">
<article>
<iframe class='iframe-three' src="./three/demo4/index.html"></iframe>
</article>
</div>
<a href="./three/demo3/index.html" target="_blank">汽车模型展览</a>
<div class="features">
<article>
<iframe class='iframe-three' src="./three/demo3/index.html"></iframe>
</article>
</div>
</div>
</section>
<!-- Four -->
<section id="four">
<div class="container">
<h3>给我留言</h3>
<p>欢迎给我留言,提出宝贵的建议.</p>
<form method="post" action="#">
<div class="row gtr-uniform">
<div class="col-6 col-12-xsmall"><input type="text" name="name" id="name" placeholder="Name" /></div>
<div class="col-6 col-12-xsmall"><input type="email" name="email" id="email" placeholder="Email" /></div>
<div class="col-12"><input type="text" name="subject" id="subject" placeholder="Subject" /></div>
<div class="col-12"><textarea name="message" id="message" placeholder="Message" rows="6"></textarea></div>
<div class="col-12">
<ul class="actions">
<li><input type="button" class="primary" value="提交" onclick="alert('感谢你的建议')"/></li>
<li><input type="reset" value="重置" /></li>
</ul>
</div>
</div>
</form>
</div>
</section>
</div>
<!-- Footer -->
<section id="footer">
<div class="container">
<ul class="copyright">
<li>© blog. All rights 2744881984@qq.com</li><li>Design: <a href="https://tenapi.cn/qq/?qq=2744881984">@2744881984</a></li>
</ul>
</div>
</section>
</div>
<!-- Scripts -->
<!-- 引用 Live2D 核心组件 -->
<script src='assets/js/static/l2d.js'></script>
<!-- 引用看板娘交互组件 -->
<script src='assets/js/static/pio.js'></script>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.scrollex.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>