Nabhan - Personal Portfolio HTML Template

# 项目简介 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（文档高亮，仅文档站点使用） ## 项目结构 ``` 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/`）可作为产品使用文档或知识库参考。