Atek - IT Solutions and Technology HTML Template

# 项目简介 Atek 是一套面向 IT 解决方案与技术服务的静态 HTML 模板，提供超过 30 个预制页面，覆盖云计算、网络安全、软件外包、数据分析、区块链金融科技等多个业务场景，适合科技公司或咨询机构的官网快速搭建。 ## 技术栈 - Bootstrap 5（响应式布局与栅格系统） - jQuery（交互逻辑、滚动导航、幻灯片等） - Font Awesome（图标字体） - SASS（CSS 预处理，定义变量与混合宏） - Magnific Popup（图片/视频弹窗） - Swiper（轮播滑动） ## 项目结构 ``` atekhtml-10/ ├── documentation/ # 官方说明文档 │ ├── index.html │ ├── css/ │ └── images/ └── download-version/ # 实际使用的模板文件 ├── index.html # 首页（主模板入口） ├── home-*.html # 16 种行业首页变体 ├── about*.html # 关于页 ├── blog*.html # 博客页 ├── contact*.html # 联系页 ├── cart.html # 购物车 ├── checkout.html # 结账 ├── error.html # 404 错误页 ├── mail.php # 邮件处理 └── assets/ ├── css/style.css # 主样式文件（内含完整 CSS 索引注释） └── js/main.js # 交互脚本（移动端菜单、置顶、滚动导航等） ``` ## 核心文件说明 - `download-version/index.html` — 主首页入口文件，引入全部 CSS 与 JS 资源 - `download-version/assets/js/main.js` — 核心交互逻辑，含移动端菜单、置顶导航、单页锚点滚动、弹窗等功能 - `download-version/assets/css/style.css` — 主样式表，采用 SASS 变量定义主题色 `--theme-color: #0B59DB` - `download-version/mail.php` — 联系表单后端处理脚本 - `download-version/home-*.html` — 各行业首页变体，按领域（AI、云计算、网络安全等）分类 - `documentation/index.html` — 官方文档，说明 HTML 结构、CSS 组成、联系方式配置等 ## 快速开始 本项目为纯静态模板，无需构建步骤： 1. 进入 `atekhtml-10/download-version/` 目录 2. 用浏览器直接打开 `index.html` 即可预览完整效果 3. 如需本地服务器（推荐），可在该目录运行： ```bash npx serve . # 或 python -m http.server 8080 ``` ## 使用建议 - 模板内所有页面共享 `assets/` 下的 CSS 与 JS，修改前请确认文件归属；`download-version/` 与 `documentation/` 目录中的同名文件内容不同，请勿混淆 - 各行业首页变体（`home-ai-machine.html`、`home-cybersecurity.html` 等）可直接复制为新页面，按需替换文字与图片资产 - 联系表单需将 `mail.php` 部署至支持 PHP 的服务器，或替换为其他后端服务以确保表单提交功能正常