项目简介
Nabhan 是一套完整的个人作品集（Portfolio）HTML5 网站模板，包含首页、关于、案例展示、服务、博客、定价、联系等页面，同时附带一套独立的在线文档站点模板。适合自由职业者、设计师、开发者搭建个人展示网站。
技术栈
- HTML5 + CSS3 + Vanilla JavaScript
- Bootstrap 5
- Google Fonts（Manrope、Playfair Display）
- Font Awesome 6
- Swiper、Owl Carousel、Magnific Popup
- WOW.js（动画效果）
- Prism.js（文档高亮，仅文档站点使用）
项目结构
text
nabhanhtml-10/template-package/
├── nabhan/ # 主站点模板
│ ├── index.html # 首页
│ ├── home-2.html # 首页变体
│ ├── about.html # 关于
│ ├── contact.html # 联系
│ ├── pricing.html # 定价
│ ├── blog.html # 博客列表
│ ├── blog-details.html # 博客详情
│ ├── project.html # 案例列表
│ ├── project-details.html # 案例详情
│ ├── service.html # 服务列表
│ ├── service-details.html # 服务详情
│ └── assets/ # CSS/JS/图片等静态资源
└── documentation/ # 独立文档站点模板
├── index.html # 文档首页
├── content.html # 内容说明
├── source.html # 源码说明
├── installation.html # 安装说明
├── log.html # 更新日志
├── thanks.html # 致谢页
└── assets/ # 文档站点资源
核心文件说明
nabhan/index.html— 个人作品集主首页，包含顶部导航、作品展示、服务介绍等区块nabhan/home-2.html— 首页第二个布局变体，提供不同视觉风格nabhan/about.html— 个人介绍页面，展示背景、技能和经历nabhan/project.html— 作品/案例展示列表页，支持图文排版nabhan/contact.html— 联系页面，含联系表单和基本信息documentation/index.html— 内置文档站点入口，可参考其结构搭建你自己的产品文档
快速开始
本项目为纯静态模板，无需安装依赖。直接在浏览器中打开，或使用任意本地服务器访问：
bash
# 方式一：直接打开
open nabhanhtml-10/template-package/nabhan/index.html
# 方式二：使用 Python 本地服务
cd nabhanhtml-10/template-package/nabhan
python -m http.server 8080
# 访问 http://localhost:8080
使用建议
所有页面模板均可独立使用，按需复制 nabhan/ 目录下的 HTML 文件到你的项目中，并同步对应的 assets 资源。模板中使用的图标库为 Remix Icons 和 Font Awesome，可替换为你自己的图标方案。文档站点模板（documentation/）可作为产品使用文档或知识库参考。
