项目简介link

Appspery 是一款基于 Bootstrap 5 的移动应用落地页模板，提供 6 种首页变体，支持深色/浅色主题切换、颜色切换器、Swiper 轮播、滚动动画（AOS）及联系表单验证。适合展示 iOS/Android App 产品页、企业官网或作品集。

技术栈link

• Bootstrap 5.3.3（响应式布局框架）
• Swiper.js（轮播组件）
• AOS - Animate On Scroll（滚动动画）
• jQuery + jQuery Easing（DOM 操作与平滑滚动）
• Google Fonts（Open Sans / Source Sans Pro）

项目结构link

Appspery_HTML_1.3.0/
├── HTML/
│   ├── index-1~6.html        # 6 种首页变体
│   ├── css/
│   │   ├── style.css         # 主样式（含 SCSS）
│   │   └── *.min.css         # 各插件压缩样式
│   ├── js/
│   │   └── app.js            # 交互逻辑
│   ├── fonts/                # 图标字体
│   └── images/               # 图片资源
└── Documentation/            # 官方文档

核心文件说明link

• HTML/index-1.html — 默认落地页入口，含 Hero、特性、截图等完整区块
• HTML/css/style.css — 主样式表，定义主题色（#656fe0）、导航、响应式断点
• HTML/js/app.js — 交互逻辑：导航滚动高亮、深浅主题切换、Swiper 初始化、表单验证
• HTML/index-*.html — 其他 5 种首页布局变体，可按需替换
• HTML/css/aos.css — 页面滚动淡入动画样式

快速开始link

纯静态项目，直接在浏览器打开入口页面即可：

HTML/index-1.html

如需本地服务器（推荐），可使用：

npx serve ./HTML
# 或
python -m http.server 8080

使用建议link

• 6 种首页变体覆盖了 Hero 大图、Coverflow 卡片、产品截图画廊等典型 App 落地页场景，替换 images/ 中的占位图后即可投入使用。
• 深色主题通过 data-bs-theme="dark" 和 localStorage 实现，首次加载默认为浅色，无需后端参与。
• 联系表单依赖 xhttp.post("php/contact.php")，若不使用 PHP 后端，需自行替换为静态表单服务（如 Formspree）。