-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathOnline Profile.html
More file actions
485 lines (448 loc) · 21.1 KB
/
Copy pathOnline Profile.html
File metadata and controls
485 lines (448 loc) · 21.1 KB
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
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
<!DOCTYPE html>
<html lang="ko">
<head>
<meta name="description" content="Web Programming Final Assignment" />
<meta name="author" content="Seo Byeong Jun" />
<title>17011806 Seo Byeong Jun</title>
<link rel="stylesheet" href="css/style.css">
<link rel="icon" href="css/images/rocket.ico">
</head>
<body class="bodyletter">
<h1 class="title"><br>TO INFINITY, AND BEYOND!<br><br></h1>
<nav id="Menu">
<ul>
<li><a class="menuLink" href="#about">About</a></li>
<li><a class="menuLink" href="#research1">Research</a></li>
<li><a class="menuLink" href="#ability">Ability</a></li>
<li><a class="menuLink" href="#photos">Photos</a></li>
<li><a class="menuLink" href="#contact">Contact</a></li>
</ul>
</nav>
<div class="home">
<h2 class="name"><br><br>SEO BYEONG JUN</h2>
<p class="birth">Since 1998.11.26.</p>
</div>
<div class="home2">
<p><b>Frontend</b> SW developer in South Korea<br>
All-Round Entertainer<br><br><br>
Smart Device Engineering, IME<br>
<b>Sejong</b> University </p>
</div>
<h4 id="about" class="title3" style="font-size: 200%">About</h4>
<img class="bg1" src="css/images/bg1.jpg">
<img src="css/images/History.png" style="float: left; position:absolute; left: 1%;margin-top: 5%;">
<div class="career">
<ul style="font-size: 80%; padding: 5% 0% 5% 7%;">
<title>Career List</title>
<li> <b>2015.03. ~ 2016.02.</b> 창원봉림고등학교 제13대 전교학생부회장 </li>
<li> <b>2015.03. ~ 2016.02.</b> 창원봉림고등학교 제13대 전교학생부회장 </li>
<li> <b>2015.05. ~ 2016.02.</b> 창원시 2학년 부회장단 연합 '가온누리' 2기 서기장 </li>
<li> <b>2016.03. ~ 2017.02.</b> 창원봉림고등학교 제14대 전교학생회장 </li>
<li> <b>2016.03. ~ 2017.02.</b> 창원시 학생회장단 연합 '한다한 14기 </li>
<li> <b>2016.05. ~ 2018.05.</b> 전국고교학생회장연합 '대한학생회' 14기 국방위원 </li>
<li> <b>2017.03. ~ 2017.12.</b> 세종대학교 제32대 총학생회 정책국 수습부원 </li>
<li> <b>2017.12. ~ 2019.02.</b> 미8군 한국군지원단 평택지역대 3-2항공대대 델타중대 카투사 복무 </li>
<li> <b>2019.02. ~ 2019.08.</b> 미8군 한국군지원단 평택지역대 3-2항공대대 Battalion Sr. Katusa 임명 </li>
<li> <b>2019.12. ~ 현재.</b> 세종대학교 제4대 소프트웨어융합대학학생회 기획국장 </li>
</ul>
</div>
<div class="career2">
Career
</div>
<div class="awards">
<ul style="font-size: 80%; padding: 5% 0% 5% 7%;">
<title>Awards List</title>
<li> <b>2017.10.</b> 세종대학교 제4회 SW경시대회 장려상 (SW중심대학사업단) </li>
<li> <b>2017.12.</b> 100초 인간탐구 영상 공모전 입상 (대양휴머니티칼리지) </li>
<li> <b>2018.02.</b> Katusa Traning Academy Commendant's List (KTA) </li>
<li> <b>2018.10.</b> Area-3 Katusa Talent Competition 1위 최우수상 (미8군한국군지원단) </li>
<li> <b>2018.12.</b> Camp Humphreys Katusas' Got Talent 2018 Solo Part 1위 최우수상 (U.S.ARMY) </li>
<li> <b>2019.08.</b> Certificate of Appreciation (U.S.ARMY) </li>
<li> <b>2019.08.</b> 육군용사상 (미8군한국군 지원단) </li>
<li> <b>2020.06.</b> 세종대학교 창의SW기초설계 교수평가회 1위 (총 39팀 참가) </li>
<li> <b>2020.08.</b> 세종대학교 지역연계수업 성과발표회 1위 서울시장상 (세종대학교캠퍼스타운조성단) </li>
<li> <b>2020.12.</b> 세종대학교 창업 아이디어 경진대회 1위 대상 (세종대학교창업지원단)</li>
</ul>
</div>
<div class="awards2">
Awards
</div>
<h4 id="research1" class="title2">Research</h4>
<div class="research" style="position:relative;">
<ol type="1" style="font-size: 80%;">
대학 입학 전
<li> <b>2014.04.</b> R&E 1차 탐구 [채광창과 광확산판을 활용한 교내 체육관 천장 구성 방안에 대한 제안] </li>
<li> <b>2014.06.</b> R&E 2차 탐구 [지속 가능한 발전을 위한 일체형 책걸상 발전기] </li>
<li> <b>2014.09.</b> R&E 3차 탐구 [탄소 절약을 위한 실내 이중창 단열재에 대한 연구] </li>
<li> <b>2014.11.</b> R&E 4차 탐구 [세포 단위에서 바라보는 인체 기관계의 상호 작용] </li>
<li> <b>2014.12.</b> 제58회 경남과학전람회 물리 부문 출품작 [가정용 에어컨 실외기의 효율적 개선방안에 대한 연구] </li>
<li> <b>2015.04.</b> R&E 5차 탐구 [와전류/전기그네 실험을 통한 전자기력 측정 결과 분석] </li>
<li> <b>2015.06.</b> R&E 6차 탐구 [베르누이의 법칙을 활용한 간이 분무기 제작 실험 결과 분석] </li>
<li> <b>2015.09.</b> R&E 7차 탐구 [셰일가스를 비롯한 비전통가스 시추 효율에 대한 분석]</li>
<li> <b>2015.11.</b> R&E 8차 탐구 [르 샤틀리에의 원리와 혈액의 완충작용에 대한 연구]</li>
<li> <b>2015.12.</b> BIT 장기 프로젝트 [금연 도우미 Android Application 'STOP' 개발 및 출시]</li>
<li> <b>2015.12.</b> 한양대학교 STS 출품작 [음파 분석을 기반으로 한 공간에 따른 소리의 균형적 전달 방안에 대한 연구]</li>
<li> <b>2016.04.</b> 자유주제탐구 [편광필름을 활용한 유동적 창문 썬팅 방안에 대한 연구]</li>
<li> <b>2016.07.</b> 자유주제탐구 [전자파 측정 실험을 통한 전자레인지의 유해성에 대한 연구 및 그에 따른 개선방안]</li>
<hr style="width: 70%;"> 대학 입학 후
<li> <b>2017.10.</b> 창의융합노마드 A모듈 [픽셀 단위 높낮이 조절을 통한 입체 디스플레이에 관한 연구]</li>
<li> <b>2017.11.</b> 창의융합노마드 B모듈 [Motion Data 기반 주방용 Human Assistance Robot 설계에 대한 연구]</li>
<li> <b>2017.12.</b> 창의융합노마드 C모듈 [GPS기반 시각장애인용 주변 인식 스마트 스틱 'ADD-Stick' 설계]</li>
<li> <b>2017.12.</b> 창의융합노마드 C모듈 [다중 마이크 입력 및 선택적 진동 출력 기반 청각장애인용 스마트 반지 'ADD-Ring' 설계]</li>
<li> <b>2020.03.</b> 창의SW기초설계 [NFC를 활용한 버스 탑승의사 전달 시스템 개발]</li>
<li> <b>2020.11.</b> 창업아이디어공모전 [승차벨, 원거리 하차벨 및 태그 리커버리 기능을 포함한 통합형 버스 이용 플랫폼]</li>
</ol>
</div>
<h4 id="ability" class="title2">I can</h4>
<div class="cards">
<div class="card">
<div class="face face-front">
<p> SPEAK </p>
</div>
<div class="face face-back" style="background-color: #8e352e;">
<img src="css/images/5flags.png" alt="flags">
</div>
</div>
<!-- 2222 -->
<div class="card">
<div class="face face-front">
<p> PLAY </p>
</div>
<div class="face face-back" style="background-color: #d3793d;">
<img src="css/images/musical.png" alt="Musical">
</div>
</div>
<div class="card">
<div class="face face-front" >
<p> CODE </p>
</div>
<div class="face face-back" style="background-color: #8f852d;">
<img src="css/images/Code.png" alt="Code">
</div>
</div>
<!-- 2222 -->
<div class="card">
<div class="face face-front">
<p> DANCE </p>
</div>
<div class="face face-back" style="background-color: #54ac54;">
<img src="css/images/dance.png" alt="dance">
</div>
</div>
<div class="card">
<div class="face face-front">
<p> DO </p>
</div>
<div class="face face-back" style="background-color: #4c4d96;">
<img src="css/images/magic.png" alt="magic">
</div>
</div>
<!-- 2222 -->
<div class="card">
<div class="face face-front">
<p style="text-align: center;"> SHOW<br>YOU</p>
</div>
<div class="face face-back" style="background-color: #84488a;">
<img src="css/images/things.png" alt="things">
</div>
</div>
</div>
<h4 id="photos" class="title2">Photos</h4>
<img class="scale" src="css/images/1.jpg">
<img class="scale" src="css/images/2.jpg">
<img class="scale" src="css/images/3.jpg">
<img class="scale" src="css/images/4.jpg">
<img class="scale" src="css/images/5.jpg">
<img class="scale" src="css/images/6.jpg">
<img class="scale" src="css/images/7.jpg">
<img class="scale" src="css/images/8.jpg">
<img class="scale" src="css/images/9.jpg">
<img class="scale" src="css/images/10.jpg">
<img class="scale" src="css/images/11.jpg">
<img class="scale" src="css/images/12.jpg">
<img class="scale" src="css/images/13.jpg">
<img class="scale" src="css/images/14.jpg">
<h4 id="contact" class="title2" style="margin-bottom: 100px;">Contact</h4>
<div id="calendar-wrap" style="width: 60%; position: relative; left: 5%;">
<header>
<h2>DEC 2020</h2>
</header>
<div id="calendar">
<ul class="weekdays">
<li>SUN</li>
<li>MON</li>
<li>TUE</li>
<li>WED</li>
<li>THU</li>
<li>FRI</li>
<li>SAT</li>
</ul>
<ul class="days">
<li class="day other-month">
<div class="date">29</div>
</li>
<li class="day other-month">
<div class="date">30</div>
<div class="event">
<div class="event-desc">
아르바이트
</div>
<div class="event-time">
16:00 ~ 23:00
</div>
</div>
</li>
<li class="day">
<div class="date">1</div>
</li>
<li class="day">
<div class="date">2</div>
</li>
<li class="day">
<div class="date">3</div>
</li>
<li class="day">
<div class="date">4</div>
</li>
<li class="day">
<div class="date">5</div>
<div class="event" style="background-color:rgb(255, 219, 219)">
<div class="event-desc">
웹프로그래밍 과제 제출
</div>
<div class="event-time">
~23:59
</div>
</div>
</li>
</ul>
<ul class="days">
<li class="day">
<div class="date">6</div>
</li>
<li class="day">
<div class="date">7</div>
<div class="event">
<div class="event-desc">
아르바이트
</div>
<div class="event-time">
16:00 ~ 23:00
</div>
</div>
</li>
<li class="day">
<div class="date">8</div>
</li>
<li class="day">
<div class="date">9</div>
</li>
<li class="day">
<div class="date">10</div>
<div class="event" style="background-color:rgb(255, 219, 219)">
<div class="event-desc">
웹프로그래밍 기말고사
</div>
<div class="event-time">
16:00 to 16:50
</div>
</div>
</li>
<li class="day">
<div class="date">11</div>
<div class="event">
<div class="event-desc">
아르바이트
</div>
<div class="event-time">
16:00 ~ 23:00
</div>
</div>
</li>
<li class="day">
<div class="date">12</div>
</li>
</ul>
<ul class="days">
<li class="day">
<div class="date">13</div>
</li>
<li class="day">
<div class="date">14</div>
<div class="event">
<div class="event-desc">
아르바이트
</div>
<div class="event-time">
16:00 ~ 23:00
</div>
</div>
</li>
<li class="day">
<div class="date">15</div>
</li>
<li class="day">
<div class="date">16</div>
</li>
<li class="day">
<div class="date">17</div>
</li>
<li class="day">
<div class="date">18</div>
<div class="event">
<div class="event-desc">
아르바이트
</div>
<div class="event-time">
16:00pm ~ 23:00pm
</div>
</div>
</li>
<li class="day">
<div class="date">19</div>
</li>
</ul>
<ul class="days">
<li class="day">
<div class="date">20</div>
</li>
<li class="day">
<div class="date">21</div>
<div class="event">
<div class="event-desc">
아르바이트
</div>
<div class="event-time">
16:00pm ~ 23:00pm
</div>
</div>
</li>
<li class="day">
<div class="date">22</div>
</li>
<li class="day">
<div class="date">23</div>
</li>
<li class="day">
<div class="date">24</div>
</li>
<li class="day">
<div class="date">25</div>
<div class="event">
<div class="event-desc">
아르바이트
</div>
<div class="event-time">
16:00pm ~ 23:00pm
</div>
</div>
</li>
<li class="day">
<div class="date">26</div>
</li>
</ul>
<ul class="days">
<li class="day">
<div class="date">27</div>
</li>
<li class="day">
<div class="date">28</div>
<div class="event">
<div class="event-desc">
아르바이트
</div>
<div class="event-time">
16:00pm ~ 23:00pm
</div>
</div>
</li>
<li class="day">
<div class="date">29</div>
</li>
<li class="day">
<div class="date">30</div>
</li>
<li class="day">
<div class="date">31</div>
</ul>
<ul class="days">
<li class="day">
<div class="date">31</div>
<div class="event">
<div class="event-desc">
아르바이트
</div>
<div class="event-time">
16:00pm ~ 23:00pm
</div>
</div>
</li>
<li class="day other-month">
<div class="date">1</div>
</li>
</ul>
</div>
</div>
<form>
<fieldset style="float:right; width: 30%; position:absolute; right:3%; border-radius: 7%; border-style:dotted;">
<legend class="title4"> Reserve Meeting </legend>
<ul style="line-height: 250%;">
<li>
<label for="name">Name</label>
<input type="text" id="name" style="width: 50%; margin-left: 8%;">
</li>
<li>
<label for="number">Phone</label>
<input type="tel" id="number" style="width: 50%; margin-left: 7%;">
</li>
<li>
<label for="date">Date</label>
<input type="date" id="date" style="width: 50%; margin-left: 10%;">
</li>
<li>
<label for="time">Time</label>
<input type="time" id="time" style="width: 50%; margin-left: 10%;">
</li>
<li>
Reason <br>
<label><input type="checkbox" name="reason1" value="duty"> Duty </label>
<label><input type="checkbox" name="reason2" value="Enjoy"> Enjoy </label>
<label><input type="checkbox" name="reason3" value="Eat"> Eat </label><br>
<label><input type="checkbox" name="reason4" value="Travel"> Travel </label>
<label><input type="checkbox" name="reason1" value="Alcohol"> Alcohol </label>
<label><input type="checkbox" name="reason1" value="Study"> Study </label>
</li>
<li>
<label for="Message">Message<br></label>
<textarea type="text" id="Message" rows="6" style="width:90%; font-size: small;"
placeholder="구조와 표현만 설계하고 데이터베이스 연결은 아직 하지 않았습니다. 추후 입력값이 왼쪽 캘린더에 반영되도록 만들어볼 예정입니다. 웹 프로그래밍에 처음 도전하는 저에게 정말 의미 있는 프로젝트였습니다. 항상 좋은 수업 감사드립니다.
- 17011806 서병준"></textarea>
</li>
</ul>
<input type="submit" style="margin-left: 40%;" value="Submit">
<input type="reset" value="Reset">
</fieldset>
</form>
<a href="#top"><img class="top" src="css/images/top.png"></a>
<div id="footer" style="float: left; margin-top: 50px;">
<div class="footer-container">
<div id="footer-link-container">
<img class="link" src="css/images/insta.png" onclick="location.href='https://www.instagram.com/givenbottle'">
<img class="link" src="css/images/facebook.png" onclick="location.href='https://www.facebook.com/profile.php?id=100006488599567'">
<img class="link" src="css/images/github.png" onclick="location.href='https://github.com/sbj6364'">
</div>
<span></span>
<span>Sejong University 209, Neungdong-ro, Gwangjin-gu, Seoul, Republic of
Korea (05006)</span>
<span>Web Programming Final Assignment </span>
</span style="text-align:center">Copyright 2020. Seo Byeong Jun all rights reserved.</span>
</div>
<div class="footer-container" id="footer-container-right">
<span>제작: 17011806 서병준 <b>Seo Byeong Jun</b></span>
<span>소속: 세종대학교 지능기전공학부 스마트기기공학전공 (Smart Device Engineering, IME, Sejong Univ.)</span>
<span>전화(TEL) : 010-4181-6364 (Available Hours: 09:00 ~ 24:00) </span>
<span>이메일(EMAIL) : <a href="mailto:sbj6364@daum.net" title="E-mail" style="color: lightgray;" >sbj6364@daum.net</a></span>
</div>
</div>
</body>
</html>