项目简介link

Omio 是一款面向自由职业者、设计师和开发者的创意个人作品集 HTML 模板。内置首页多版本（含单页版）、博客、作品集、团队、定价页等完整页面，支持联系表单和响应式布局，可直接修改文字和图片上线使用。

技术栈link

• HTML5 / CSS3（静态页面）
• Bootstrap 5
• Swiper Slider / Slick Carousel / Magnific Popup
• Font Awesome Pro
• jQuery（部分交互组件依赖）
• PHP（仅 mail.php 用于联系表单邮件发送）

项目结构link

omiohtml-10/Omio/
├── Documentation/
│   ├── index.html          # 在线文档入口
│   └── assets/             # 文档静态资源
└── HTML Template/
    ├── index.html          # 首页（默认版）
    ├── index-2.html ~ index-4.html  # 首页其他风格
    ├── index-one-page.html ~ index4-one-page.html  # 单页版本
    ├── about.html / blog*.html / contact.html / error.html
    ├── faq.html / pricing.html / service.html / testimonial.html
    ├── portfolio*.html / team*.html
    ├── assets/
    │   ├── css/             # 所有样式文件
    │   ├── js/              # 脚本文件
    │   ├── img/             # 图片资源
    │   └── mail.php         # 联系表单后端

核心文件说明link

• HTML Template/index.html — 默认首页入口
• HTML Template/assets/css/main.css — 主样式文件，修改配色和布局主要在此
• HTML Template/assets/mail.php — 联系表单提交后发送邮件的后端逻辑（需 PHP 环境）
• Documentation/index.html — 官方文档，含模板结构、自定义图文、更换颜色等说明
• HTML Template/contact.html — 联系页面，内置表单提交逻辑
• HTML Template/error.html — 404 错误页模板

快速开始link

纯静态模板，无需构建：

1. 进入 omiohtml-10/Omio/HTML Template/ 目录
2. 双击 index.html 用浏览器打开即可预览
3. 如需联系表单功能，需将整个 HTML Template 目录部署到支持 PHP 的 Web 服务器，并修改 mail.php 中的 $recipient 为实际邮箱

使用建议link

模板提供了 4 种首页风格和对应的单页版本，建议根据内容体量选择——单页版适合作品少但需精炼呈现的场景；完整版适合需要博客、团队等多模块展示的情况。联系表单的 mail.php 默认发往硬编码邮箱，部署前请务必替换为真实邮箱地址。