Nabhan - 个人作品集 HTML 模板

Nabhan - 个人作品集 HTML 模板

category作品集
# 项目简介 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/`)可作为产品使用文档或知识库参考。
help_outline

常见问题

评论0
发布时间Jan 20, 2026

技术栈

HTML