365 lines
12 KiB
HTML
365 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Zengtudor - 个人简历</title>
|
||
<style>
|
||
:root {
|
||
--bg-color: #f4f4f4;
|
||
--card-bg-color: #ffffff;
|
||
--text-color: #333333;
|
||
--link-color: #007BFF;
|
||
--link-hover-color: #0056b3;
|
||
--divider-color: #e8e8e8;
|
||
--progress-bg-color: #e9ecef;
|
||
--progress-bar-color: #007BFF;
|
||
}
|
||
|
||
body {
|
||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||
background-color: var(--bg-color);
|
||
color: var(--text-color);
|
||
margin: 0;
|
||
padding: 0;
|
||
scroll-behavior: smooth;
|
||
}
|
||
|
||
.card {
|
||
background-color: var(--card-bg-color);
|
||
border-radius: 10px;
|
||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
||
margin: 50px auto;
|
||
max-width: 85%;
|
||
padding: 30px;
|
||
transition: box-shadow 0.3s ease;
|
||
}
|
||
|
||
.card:hover {
|
||
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
|
||
}
|
||
|
||
.header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 30px;
|
||
}
|
||
|
||
.avatar {
|
||
border-radius: 50%;
|
||
width: 120px;
|
||
height: 120px;
|
||
object-fit: cover;
|
||
transition: transform 0.3s ease;
|
||
}
|
||
|
||
.avatar:hover {
|
||
transform: scale(1.1);
|
||
}
|
||
|
||
.name-contact {
|
||
flex-grow: 1;
|
||
margin-left: 20px;
|
||
}
|
||
|
||
.name {
|
||
font-size: 32px;
|
||
font-weight: bold;
|
||
margin-bottom: 5px;
|
||
}
|
||
|
||
.position {
|
||
font-size: 18px;
|
||
color: #666;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.contact {
|
||
font-size: 16px;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
.contact a {
|
||
color: var(--link-color);
|
||
text-decoration: none;
|
||
margin-right: 15px;
|
||
transition: color 0.3s ease;
|
||
}
|
||
|
||
.contact a:hover {
|
||
color: var(--link-hover-color);
|
||
}
|
||
|
||
.intro {
|
||
font-family: 'Dancing Script', cursive;
|
||
position: relative;
|
||
padding-left: 20px;
|
||
margin-bottom: 30px;
|
||
}
|
||
|
||
.intro::before {
|
||
content: '';
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
bottom: 0;
|
||
width: 3px;
|
||
background-color: var(--link-color);
|
||
}
|
||
|
||
.section {
|
||
margin-bottom: 30px;
|
||
position: relative;
|
||
}
|
||
|
||
.section:not(:last-child)::after {
|
||
content: '';
|
||
position: absolute;
|
||
bottom: -15px;
|
||
left: 0;
|
||
right: 0;
|
||
height: 1px;
|
||
background-color: var(--divider-color);
|
||
}
|
||
|
||
.section h2 {
|
||
font-size: 24px;
|
||
margin-bottom: 15px;
|
||
padding-bottom: 10px;
|
||
}
|
||
|
||
.timeline-item {
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.timeline-item h3 {
|
||
font-size: 20px;
|
||
margin-bottom: 5px;
|
||
}
|
||
|
||
.timeline-item p {
|
||
margin: 0;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
.progress-bar {
|
||
background-color: var(--progress-bg-color);
|
||
border-radius: 5px;
|
||
height: 20px;
|
||
margin-bottom: 15px;
|
||
position: relative;
|
||
}
|
||
|
||
.progress {
|
||
background-color: var(--progress-bar-color);
|
||
border-radius: 5px;
|
||
height: 100%;
|
||
text-align: left;
|
||
padding-left: 10px;
|
||
color: white;
|
||
font-size: 14px;
|
||
}
|
||
|
||
.radar-chart {
|
||
width: 100%;
|
||
height: 230px;
|
||
}
|
||
|
||
@keyframes fadeIn {
|
||
from {
|
||
opacity: 0;
|
||
transform: translateY(20px);
|
||
}
|
||
to {
|
||
opacity: 1;
|
||
transform: translateY(0);
|
||
}
|
||
}
|
||
|
||
.fade-in {
|
||
animation: fadeIn 1s ease-out;
|
||
}
|
||
|
||
.skills-container {
|
||
display: flex;
|
||
gap: 20px;
|
||
}
|
||
|
||
.progress-container {
|
||
flex: 1;
|
||
}
|
||
|
||
.radar-container {
|
||
flex: 1;
|
||
}
|
||
|
||
.footer-contact {
|
||
display: flex;
|
||
justify-content: center;
|
||
gap: 20px;
|
||
margin-top: 30px;
|
||
}
|
||
|
||
.footer-contact a {
|
||
color: var(--link-color);
|
||
font-size: 24px;
|
||
transition: color 0.3s ease;
|
||
}
|
||
|
||
.footer-contact a:hover {
|
||
color: var(--link-hover-color);
|
||
}
|
||
</style>
|
||
<link href="https://fonts.googleapis.com/css2?family=Dancing Script&display=swap" rel="stylesheet">
|
||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
|
||
</head>
|
||
|
||
<body>
|
||
<div class="card">
|
||
<div class="header">
|
||
<img class="avatar" src="https://picsum.photos/200/200" alt="Zengtudor">
|
||
<div class="name-contact">
|
||
<div class="name">Zengtudor</div>
|
||
<div class="position">算法竞赛与全栈开发学习者</div>
|
||
<div class="contact">
|
||
<a href="mailto:2917946698@qq.com"><i class="fa-solid fa-envelope"></i> 2917946698@qq.com</a>
|
||
<a href="mailto:Zengtudor@outlook.com"><i class="fa-solid fa-envelope"></i> Zengtudor@outlook.com</a>
|
||
<a href="https://gitcode.com/Zengtudor"><i class="fa-brands fa-github"></i> GitCode</a>
|
||
<a href="https://blog.zziyu.cn/"><i class="fa-brands fa-blogger"></i> 个人博客</a>
|
||
<a href="https://git.zziyu.cn/"><i class="fa-brands fa-gitlab"></i> 代码库</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="intro fade-in">
|
||
<p>我是Zengtudor，一名热爱计算机科学的高中生。专注于C++算法竞赛与全栈开发，熟悉现代C++编程范式，掌握Node.js、Vue、C#和Python等多种技术栈。对生物信息工程项目有深入研究，曾实现40倍并行加速优化。热衷于探索计算机科学的各个领域，追求技术的极致与创新。如有有偿程序开发需求，欢迎联系我。</p>
|
||
</div>
|
||
<div class="section fade-in">
|
||
<h2>教育背景</h2>
|
||
<div class="timeline-item">
|
||
<h3>高中在读</h3>
|
||
<p>2024 - 至今</p>
|
||
<ul>
|
||
<li>参与学校科技创新社团，主导多个编程项目开发。</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="section fade-in">
|
||
<h2>获奖信息</h2>
|
||
<div class="timeline-item">
|
||
<h3>国家级竞赛</h3>
|
||
<ul>
|
||
<li>[2023] CSP-J（入门级）二等奖</li>
|
||
<li>[2024] CSP-S（提高级）三等奖</li>
|
||
<li>[2024] NOIP（全国青少年信息学奥林匹克联赛）三等奖</li>
|
||
<li>蓝桥杯省赛一等奖</li>
|
||
</ul>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<h3>其他荣誉</h3>
|
||
<ul>
|
||
<li>深圳科创明日之星称号</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="section fade-in">
|
||
<h2>专业技能</h2>
|
||
<div class="skills-container">
|
||
<div class="progress-container">
|
||
<div class="progress-bar">
|
||
<div class="progress" style="width: 95%;">C++ 算法竞赛 - 95%</div>
|
||
</div>
|
||
<div class="progress-bar">
|
||
<div class="progress" style="width: 85%;">现代 C++ 编程 - 85%</div>
|
||
</div>
|
||
<div class="progress-bar">
|
||
<div class="progress" style="width: 80%;">Node.js & Vue 开发 - 80%</div>
|
||
</div>
|
||
<div class="progress-bar">
|
||
<div class="progress" style="width: 75%;">Python 与数据处理 - 75%</div>
|
||
</div>
|
||
<div class="progress-bar">
|
||
<div class="progress" style="width: 70%;">Docker 与容器化部署 - 70%</div>
|
||
</div>
|
||
<div class="progress-bar">
|
||
<div class="progress" style="width: 65%;">嵌入式系统开发 - 65%</div>
|
||
</div>
|
||
</div>
|
||
<div class="radar-container">
|
||
<canvas class="radar-chart" id="radarChart"></canvas>
|
||
</div>
|
||
</div>
|
||
<script>
|
||
const ctx = document.getElementById('radarChart').getContext('2d');
|
||
const myRadarChart = new Chart(ctx, {
|
||
type: 'radar',
|
||
data: {
|
||
labels: ['C++ 算法', '现代 C++', 'Web 开发', '数据处理', '系统部署', '嵌入式开发'],
|
||
datasets: [{
|
||
label: '技能水平',
|
||
data: [95, 85, 80, 75, 70, 65],
|
||
backgroundColor: 'rgba(0, 123, 255, 0.2)',
|
||
borderColor: 'rgba(0, 123, 255, 1)',
|
||
borderWidth: 1
|
||
}]
|
||
},
|
||
options: {
|
||
scales: {
|
||
r: {
|
||
min: 0,
|
||
max: 100
|
||
}
|
||
}
|
||
}
|
||
});
|
||
</script>
|
||
</div>
|
||
<div class="section fade-in">
|
||
<h2>项目经验</h2>
|
||
<div class="timeline-item">
|
||
<h3>生物信息工程项目优化</h3>
|
||
<p>2023 - 2024</p>
|
||
<ul>
|
||
<li>对生物信息学序列比对算法进行并行优化，通过多线程和向量化技术实现了40倍的性能提升。</li>
|
||
<li>使用现代C++（C++17/20）重构原有代码，引入智能指针、并行算法和协程等特性，提高代码质量和可维护性。</li>
|
||
<li>开发了自动化测试框架，确保优化后的代码保持正确性和稳定性。</li>
|
||
</ul>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<h3>基于C++与webview的数据驱动框架桌面程序</h3>
|
||
<p>2024</p>
|
||
<ul>
|
||
<li>使用C++结合WebView技术开发跨平台桌面应用框架，实现数据模型与界面的双向绑定。</li>
|
||
<li>设计模块化架构，支持插件式功能扩展，提升系统灵活性和可维护性。</li>
|
||
</ul>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<h3>为《笔顺码字典》使用Vue的数据驱动与SSR渲染开发信息化查询平台</h3>
|
||
<p>2024</p>
|
||
<ul>
|
||
<li>采用Vue.js构建数据驱动的前端应用，实现组件化开发和状态管理。</li>
|
||
<li>集成SSR（服务器端渲染）技术，提升页面加载速度和搜索引擎优化效果。</li>
|
||
</ul>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<h3>大模型本地部署与向量知识库联动与工作流程序开发</h3>
|
||
<p>2024</p>
|
||
<ul>
|
||
<li>在本地环境部署开源大语言模型，结合FAISS实现向量知识库的高效检索与联动。</li>
|
||
<li>设计自动化工作流程序，实现数据预处理、模型推理到结果输出的全流程管理。</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="footer-contact">
|
||
<a href="mailto:2917946698@qq.com"><i class="fa-solid fa-envelope"></i></a>
|
||
<a href="mailto:Zengtudor@outlook.com"><i class="fa-solid fa-envelope"></i></a>
|
||
<a href="https://gitcode.com/Zengtudor"><i class="fa-brands fa-github"></i></a>
|
||
<a href="https://blog.zziyu.cn/"><i class="fa-brands fa-blogger"></i></a>
|
||
<a href="https://git.zziyu.cn/"><i class="fa-brands fa-gitlab"></i></a>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
|
||
</html> |