项目简介link

Reluxe 是一款面向美容SPA、理发店和医学美容机构的静态 HTML 模板，提供首页（3 种 banner 风格）、关于我们、服务、案例、团队、博客、FAQ、联系等完整页面。模板采用 Bootstrap 框架，内置 Swiper 轮播、计数器、滚动动画等交互组件，适合快速搭建美业展示型网站。

技术栈link

• HTML5 + CSS3（静态页面）
• Bootstrap 5（栅格布局、基础组件）
• jQuery 3.7.1（DOM 交互）
• Swiper Bundle（轮播组件）
• jQuery Nice Select（自定义下拉框）
• Magnific Popup（图片/视频弹窗）
• Wow.js + Animate.css（滚动入场动画）
• MeanMenu（移动端响应式导航）
• SCSS（源码编译，可自定义主题变量）

项目结构link

reluxehtml-10/Reluxe/
├── index.html               # 首页（主）
├── index2.html              # 首页（风格二）
├── index3.html              # 首页（风格三）
├── about.html / blog*.html  # 内容页（7 个）
├── project*.html            # 案例相关（2 个）
├── services*.html           # 服务相关（2 个）
├── team*.html               # 团队相关（2 个）
├── contact.html / faq.html  # 联系 / FAQ
└── assets/
    ├── css/main.css         # 合并后的样式文件
    ├── js/main.js           # 交互脚本（轮播、计数、动画等）
    ├── images/              # 静态图片资源
    └── scss/                # 38 个 SCSS 源码文件
        ├── _variables.scss  # 主题颜色 / 字体变量
        ├── _header.scss / _footer.scss
        ├── _services.scss / _team.scss
        └── ...              # 其他模块化样式片段

核心文件说明link

• Reluxe/index.html — 模板入口首页，展示各模块组件
• assets/css/main.css — 完整样式表，定义字体、颜色、布局及所有组件样式
• assets/js/main.js — 交互逻辑：轮播初始化、计数动画、WOW 动画、移动端菜单等
• assets/scss/_variables.scss — 全局 CSS 变量（主题色 --theme、字体、间距等）
• assets/scss/ — 模块化 SCSS 源码，修改此处可重新编译定制主题
• index2.html / index3.html — 首页的备选视觉方案，可直接作为项目首页

快速开始link

本项目为纯静态模板，无需安装依赖：

1. 直接用浏览器打开 Reluxe/index.html 预览效果
2. 若需修改 SCSS，需在本地安装 Sass 编译器后运行 sass assets/scss/main.scss assets/css/main.css
3. 将 Reluxe 文件夹部署到任意静态服务器即可上线

使用建议link

• 正式项目使用前，删除页面中的演示内容（如占位联系方式、Lorem ipsum 文案），替换为真实数据
• 主题色为 #C28565，可通过修改 assets/scss/_variables.scss 中的 --theme 变量快速换色
• 模板提供了 3 种首页风格，建议先确认设计稿对应的是 index.html、index2.html 还是 index3.html，避免重复修改