-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout.html
209 lines (167 loc) · 7.98 KB
/
about.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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>About My Resume</title>
<meta content="" name="description">
<meta content="" name="keywords">
<!-- Favicons -->
<link href="assets/img/tzuicon.jpg" rel="icon">
<link href="assets/img/tzuicon.jpg" rel="apple-touch-icon">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">
<!-- Vendor CSS Files -->
<link href="assets/vendor/aos/aos.css" rel="stylesheet">
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">
<!-- Template Main CSS File -->
<link href="assets/css/style.css" rel="stylesheet">
</head>
<body>
<!-- ======= Header ======= -->
<header id="header" class="fixed-top">
<div class="container-fluid d-flex justify-content-between align-items-center">
<h1 class="logo me-auto me-lg-0"><a href="index.html">Tzu Chun</a></h1>
<!-- Uncomment below if you prefer to use an image logo -->
<!-- <a href="index.html" class="logo"><img src="assets/img/logo.png" alt="" class="img-fluid"></a>-->
<nav id="navbar" class="navbar order-last order-lg-0">
<ul>
<li><a href="index.html">Home</a></li>
<li><a class="active" href="about.html">About</a></li>
<li><a href="resume.html">Resume</a></li>
<li><a href="skill.html">Skill</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
</ul>
<i class="bi bi-list mobile-nav-toggle"></i>
</nav><!-- .navbar -->
<!--div class="header-social-links">
</div-->
</div>
</header><!-- End Header -->
<main id="main">
<!-- ======= About Section ======= -->
<section id="about" class="about">
<div class="container" data-aos="fade-up">
<div class="section-title">
<h2>About Me</h2>
</div>
<div class="row">
<div class="col-lg-4">
<img src="" class="img-fluid" alt="">
</div>
<div class="col-lg-8 pt-4 pt-lg-0 content">
<h3>My Enthusiasm</h3>
<p class="fst-italic">
I have great passion to work in the Web-Design field and I think it has a lot of potential<br>
In this past year, I attended training sessions on web design and<br>
I'm glad that I invested my time in additional training and courses.<br>
Besides, I'm a constant learner and I invest significant time in developing my skills.
</p>
<div class="row">
<div class="col-lg-6">
<ul>
<li><i class="bi bi-rounded-right"></i><strong>Birthday:</strong></li>
<li><i class="bi bi-rounded-right"></i><strong>github:</strong><a href="https://github.com/tzutzuliu">My github</a></li>
<li><i class="bi bi-rounded-right"></i><strong>City:</strong>Hsinchu, Taiwan</li>
</ul>
</div>
<div class="col-lg-6">
<ul>
<li><i class="bi bi-rounded-right"></i> <strong>Age:</strong>xx</li>
<li><i class="bi bi-rounded-right"></i> <strong>Email:</strong></li>
</ul>
</div>
</div>
<h3>關於我</h3>
<!--p>
畢業於國立臺灣海洋大學碩士，我的個性隨和、樂觀，喜歡學習新的事物，對於好奇的事物以積極認真的態度達成目標。
<br>
求學期間很嚮往能在學術、教育界服務，很幸運地，畢業後我完成了在學術界服務的夢想。
<br>
在過去的工作經驗裡，須負責維護網頁，管理並更新網頁資訊。
<br>
意外的發現自己對網頁設計產生了興趣，此外，想提升並擴增自己專業技能，
<br>
也期許自己未來在工作上能發揮所學技能，運用程式解決問題，並不斷的精進自己專業能力，持續成長!
<--/p>
</div>
</div>
</div>
</section><!-- End About Section -->
<!-- ======= Skills Section ======= -->
<section id="skills" class="skills">
<div class="container" data-aos="fade-up">
<div class="section-title">
<h2>My Skills</h2>
</div>
<div class="row skills-content">
<div class="col-lg-6">
<div class="progress">
<span class="skill">HTML <i class="val">100%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">CSS <i class="val">90%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">JavaScript <i class="val">75%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="progress">
<span class="skill">PHP <i class="val">80%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">Illustrator<i class="val">90%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">Photoshop <i class="val">55%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="55" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div>
</div>
</section><!-- End Skills Section -->
<!-- ======= Footer ======= -->
<footer id="footer">
<div class="container">
<div class="copyright">
© Copyright <strong><span>Tzu Chun</span></strong>. All Rights Reserved
</div>
</div>
</footer><!-- End Footer -->
<div id="preloader"></div>
<a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a>
<!-- Vendor JS Files -->
<script src="assets/vendor/purecounter/purecounter_vanilla.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/vendor/waypoints/noframework.waypoints.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<!-- Template Main JS File -->
<script src="assets/js/main.js"></script>
</body>
</html>