
Appspery v1.3.0 - Bootstrap 5 应用程序登陆模板
categorySaaS
# 项目简介
Appspery 是一款基于 Bootstrap 5 的移动应用落地页模板,提供 6 种首页变体,支持深色/浅色主题切换、颜色切换器、Swiper 轮播、滚动动画(AOS)及联系表单验证。适合展示 iOS/Android App 产品页、企业官网或作品集。
## 技术栈
- Bootstrap 5.3.3(响应式布局框架)
- Swiper.js(轮播组件)
- AOS - Animate On Scroll(滚动动画)
- jQuery + jQuery Easing(DOM 操作与平滑滚动)
- Google Fonts(Open Sans / Source Sans Pro)
## 项目结构
```
Appspery_HTML_1.3.0/
├── HTML/
│ ├── index-1~6.html # 6 种首页变体
│ ├── css/
│ │ ├── style.css # 主样式(含 SCSS)
│ │ └── *.min.css # 各插件压缩样式
│ ├── js/
│ │ └── app.js # 交互逻辑
│ ├── fonts/ # 图标字体
│ └── images/ # 图片资源
└── Documentation/ # 官方文档
```
## 核心文件说明
- `HTML/index-1.html` — 默认落地页入口,含 Hero、特性、截图等完整区块
- `HTML/css/style.css` — 主样式表,定义主题色(#656fe0)、导航、响应式断点
- `HTML/js/app.js` — 交互逻辑:导航滚动高亮、深浅主题切换、Swiper 初始化、表单验证
- `HTML/index-*.html` — 其他 5 种首页布局变体,可按需替换
- `HTML/css/aos.css` — 页面滚动淡入动画样式
## 快速开始
纯静态项目,直接在浏览器打开入口页面即可:
```
HTML/index-1.html
```
如需本地服务器(推荐),可使用:
```bash
npx serve ./HTML
# 或
python -m http.server 8080
```
## 使用建议
- 6 种首页变体覆盖了 Hero 大图、Coverflow 卡片、产品截图画廊等典型 App 落地页场景,替换 `images/` 中的占位图后即可投入使用。
- 深色主题通过 `data-bs-theme="dark"` 和 `localStorage` 实现,首次加载默认为浅色,无需后端参与。
- 联系表单依赖 `xhttp.post("php/contact.php")`,若不使用 PHP 后端,需自行替换为静态表单服务(如 Formspree)。
help_outline
常见问题
评论0
发布时间Dec 7, 2025
技术栈
HTML
标签
appapp landingapp landing pageapp showcaseapp storeapp templateapp websiteclean app landingcreative app landing pagelanding pagemobilemobile app landing pagemodern app Landing