265 lines
12 KiB
HTML
265 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">
|
||
<link rel="shortcut icon" href="images/favicon.png">
|
||
<title>计算机协会 - 协会介绍</title>
|
||
<link rel="stylesheet" href="css/style.css">
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
|
||
</head>
|
||
<body>
|
||
<!-- 导航栏 -->
|
||
<header>
|
||
<div class="container">
|
||
<nav>
|
||
<div class="logo">
|
||
<img id="logoImage" src="images/skx-w.png" alt="石科信计算机协会">
|
||
</div>
|
||
<button class="hamburger" id="hamburger">
|
||
<span></span>
|
||
<span></span>
|
||
<span></span>
|
||
<span></span>
|
||
</button>
|
||
<ul class="nav-links">
|
||
<li><a href="/">首页</a></li>
|
||
<li><a href="/about" class="active">协会介绍</a></li>
|
||
<li><a href="/platform">协会平台</a></li>
|
||
<li><a href="https://news.skxjx.holytreasure.space/">信息中心</a></li>
|
||
<li><a href="https://git.holytreasure.space/holytreasure/">加入我们</a></li>
|
||
<li>
|
||
<label class="theme-switch">
|
||
<input type="checkbox" id="themeToggle">
|
||
<span class="slider round">
|
||
<i class="fas fa-moon icon moon"></i>
|
||
<i class="fas fa-sun icon sun"></i>
|
||
</span>
|
||
</label>
|
||
</li>
|
||
</ul>
|
||
</nav>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- 移动端导航菜单 -->
|
||
<div class="mobile-nav" id="mobileNav">
|
||
<button class="close-btn" id="closeBtn">
|
||
<i class="fas fa-times"></i>
|
||
</button>
|
||
<ul class="mobile-nav-links">
|
||
<li><a href="/">首页</a></li>
|
||
<li><a href="/about" class="active">协会介绍</a></li>
|
||
<li><a href="/platform">协会平台</a></li>
|
||
<li><a href="https://news.skxjx.holytreasure.space/">信息中心</a></li>
|
||
<li><a href="https://git.holytreasure.space/holytreasure/">加入我们</a></li>
|
||
</ul>
|
||
<div class="mobile-theme-toggle">
|
||
<span>暗黑模式</span>
|
||
<label class="theme-switch">
|
||
<input type="checkbox" id="mobileThemeToggle">
|
||
<span class="slider round">
|
||
<i class="fas fa-moon icon moon"></i>
|
||
<i class="fas fa-sun icon sun"></i>
|
||
</span>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 页面标题区域 -->
|
||
<section class="page-header">
|
||
<div class="container">
|
||
<h1 class="page-title">协会介绍</h1>
|
||
<p class="page-subtitle">探索计算机协会的使命、愿景与价值观，了解我们的组织架构和辉煌历程</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 协会简介 -->
|
||
<section class="content-section">
|
||
<div class="container">
|
||
<h2 class="section-title">协会简介</h2>
|
||
<p class="section-description">计算机协会成立于2010年，是由一群热爱计算机技术的在校学生自发组织的学术性团体，致力于推动校园计算机文化发展和技术创新。</p>
|
||
|
||
<div class="about-intro">
|
||
<div class="about-image">
|
||
<img src="images/about-intro.jpg" alt="协会活动照片">
|
||
</div>
|
||
<div class="about-text">
|
||
<h3>我们的使命</h3>
|
||
<p>计算机协会以"技术改变生活，创新引领未来"为宗旨，致力于为全校师生提供一个学习、交流和实践计算机技术的平台。</p>
|
||
<p>我们定期举办技术讲座、编程竞赛、项目开发等活动，帮助会员提升专业技能，培养创新思维，为未来的职业发展打下坚实基础。</p>
|
||
<p>协会下设技术部、宣传部、外联部和项目管理部四个部门，各部门分工协作，共同推动协会发展。</p>
|
||
<a href="#join" class="btn">加入我们</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 组织架构 -->
|
||
<section class="org-structure">
|
||
<div class="container">
|
||
<h2 class="section-title">组织架构</h2>
|
||
<p class="section-description">计算机协会采用扁平化管理结构，各部门分工明确，协同合作，确保协会高效运转。</p>
|
||
|
||
<div class="org-chart">
|
||
<div class="org-level">
|
||
<!-- 第一行 -->
|
||
<div class="org-node">
|
||
<h4>指导老师</h4>
|
||
<p>提供专业指导与支持</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="org-connection"></div>
|
||
|
||
<div class="org-level">
|
||
<!-- 第二行 -->
|
||
<div class="org-node">
|
||
<h4>会长</h4>
|
||
<p>负责协会整体规划与决策</p>
|
||
</div>
|
||
|
||
<div class="org-node">
|
||
<h4>副会长</h4>
|
||
<p>协助会长管理协会事务</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="org-connection"></div>
|
||
|
||
<div class="org-level">
|
||
<!-- 第三行 -->
|
||
<div class="org-node">
|
||
<h4>软件部</h4>
|
||
<p>负责软件开发与技术研究</p>
|
||
</div>
|
||
<div class="org-node">
|
||
<h4>硬件部</h4>
|
||
<p>负责硬件开发与维护</p>
|
||
</div>
|
||
<div class="org-node">
|
||
<h4>秘书处</h4>
|
||
<p>负责日常事务与协调工作</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 发展历程 -->
|
||
<section class="content-section">
|
||
<div class="container">
|
||
<h2 class="section-title">发展历程</h2>
|
||
<p class="section-description">回顾计算机协会从创立至今的重要里程碑，见证我们的成长与蜕变。</p>
|
||
|
||
<div class="timeline">
|
||
<div class="timeline-item">
|
||
<div class="timeline-content">
|
||
<div class="timeline-date">2010年9月</div>
|
||
<h3 class="timeline-title">计算机协会成立</h3>
|
||
<p class="timeline-desc">由5名计算机爱好者发起，正式成立计算机协会，首批会员20人。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="timeline-item">
|
||
<div class="timeline-content">
|
||
<div class="timeline-date">2012年3月</div>
|
||
<h3 class="timeline-title">首届编程大赛</h3>
|
||
<p class="timeline-desc">成功举办校内首届编程大赛，吸引100余名学生参与。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="timeline-item">
|
||
<div class="timeline-content">
|
||
<div class="timeline-date">2015年10月</div>
|
||
<h3 class="timeline-title">开源项目启动</h3>
|
||
<p class="timeline-desc">首个开源项目"校园助手"在GitHub上线，获得100+星标。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="timeline-item">
|
||
<div class="timeline-content">
|
||
<div class="timeline-date">2018年5月</div>
|
||
<h3 class="timeline-title">校企合作</h3>
|
||
<p class="timeline-desc">与3家知名IT企业建立合作关系，提供实习机会。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="timeline-item">
|
||
<div class="timeline-content">
|
||
<div class="timeline-date">2020年12月</div>
|
||
<h3 class="timeline-title">会员突破500人</h3>
|
||
<p class="timeline-desc">协会规模扩大，成为校内最具影响力的学术社团之一。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="timeline-item">
|
||
<div class="timeline-content">
|
||
<div class="timeline-date">2023年至今</div>
|
||
<h3 class="timeline-title">持续创新</h3>
|
||
<p class="timeline-desc">开展AI、区块链等前沿技术研究，培养创新型人才。</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 荣誉展示 -->
|
||
<section class="honors">
|
||
<div class="container">
|
||
<h2 class="section-title">荣誉展示</h2>
|
||
<p class="section-description">计算机协会成员在各类竞赛和项目中取得的优异成绩，是我们共同的骄傲。</p>
|
||
|
||
<div class="honors-grid">
|
||
<div class="honor-card">
|
||
<div class="honor-image">
|
||
<img src="images/honor1.jpg" alt="全国大学生程序设计竞赛">
|
||
</div>
|
||
<div class="honor-content">
|
||
<div class="honor-date">2022年11月</div>
|
||
<h3 class="honor-title">全国大学生程序设计竞赛</h3>
|
||
<p class="honor-desc">协会代表队获得全国一等奖，创造了学校在该赛事中的最佳成绩。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="honor-card">
|
||
<div class="honor-image">
|
||
<img src="images/honor2.jpg" alt="最佳学生社团">
|
||
</div>
|
||
<div class="honor-content">
|
||
<div class="honor-date">2021年12月</div>
|
||
<h3 class="honor-title">最佳学生社团</h3>
|
||
<p class="honor-desc">连续三年荣获学校"最佳学生社团"称号，表彰协会的突出贡献。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="honor-card">
|
||
<div class="honor-image">
|
||
<img src="images/honor3.jpg" alt="开源社区贡献奖">
|
||
</div>
|
||
<div class="honor-content">
|
||
<div class="honor-date">2023年3月</div>
|
||
<h3 class="honor-title">开源社区贡献奖</h3>
|
||
<p class="honor-desc">协会开源项目获得国内知名开源社区颁发的"年度最佳贡献奖"。</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 页脚 -->
|
||
<footer>
|
||
<div class="container">
|
||
<ul class="footer-links">
|
||
<li><a href="/about">关于我们</a></li>
|
||
<li><a href="/contact">联系我们</a></li>
|
||
<li><a href="https://git.holytreasure.space/">Git仓库</a></li>
|
||
<li><a href="#">隐私政策</a></li>
|
||
</ul>
|
||
<p class="copyright">© 2023 计算机协会. 保留所有权利.</p>
|
||
</div>
|
||
</footer>
|
||
|
||
<script src="js/about.js"></script>
|
||
</body>
|
||
</html> |