项目简介link

SaasoX 是一款面向 SaaS 与软件产品的静态 HTML 模板，提供了首页多版本、服务、团队、定价、博客等多个业务页面，适合快速搭建软件官网或落地页。

技术栈link

• 前端框架：Bootstrap 5（响应式布局）
• 动态交互：jQuery（移动端菜单、轮播、计数器、定价切换等）
• 动画库：Animate.css + WOW.js（滚动触发动画）
• 轮播组件：Slick Slider
• 图标：FontAwesome 6.6.0
• 字体：Sora（标题）、DM Sans（正文）

项目结构link

saasoxhtml-10/
├── SaasoX - Documentation/
│   ├── index.html         # 使用文档入口
│   └── assets/css/        # 文档样式
└── SaasoX - Template/
    ├── index.html         # 首页主版
    ├── home-v2.html       # 首页变体二
    ├── home-v3.html       # 首页变体三
    ├── about-us.html
    ├── services.html
    ├── service-details.html
    ├── projects.html
    ├── project-details.html
    ├── team.html
    ├── team-details.html
    ├── pricing.html
    ├── integrations.html
    ├── faqs.html
    ├── error.html
    ├── blog.html
    ├── blog-standard.html
    ├── blog-details.html
    └── contact.html
    └── assets/
        ├── css/           # 样式文件（主样式 + 第三方）
        ├── fonts/         # FontAwesome 字体
        ├── img/           # 图标与占位图片
        └── js/            # jQuery 插件 + main.js

核心文件说明link

• SaasoX - Template/index.html — 首页主页面，包含 Hero、特性、服务、定价等区块
• assets/css/style.css — 模板主样式表，定义了颜色变量、排版、间距及全站布局
• assets/js/main.js — 交互逻辑：预加载、移动端菜单、吸顶导航、轮播初始化、计数器动画、定价切换、Isotope 过滤等
• assets/css/bootstrap.min.css — Bootstrap 基础样式与响应式网格系统
• pricing.html — 定价页面，含月/年切换按钮（pricingToggle 函数控制）
• blog.html / blog-standard.html — 博客列表页，支持 Isotope 分类过滤

快速开始link

1. 将 SaasoX - Template 文件夹上传至服务器（推荐 Nginx/Apache）；
2. 直接在浏览器打开 index.html 即可预览全部页面；
3. 如需替换图片：将 assets/img/ 下的占位图替换为实际素材；
4. 如需修改配色：编辑 assets/css/style.css 顶部的 CSS 变量（--theme-color-2 等）。

使用建议link

• 本模板为纯静态，无需任何构建工具即可使用；
• contact.html 中包含联系表单占位结构，可对接第三方表单服务（如 Formspree）实现真实提交；
• 模板内置了多个首页变体，建议根据实际业务选择对应版本，再删除不需要的 HTML 文件以保持项目整洁。