项目简介link

Sabi 是一套面向数字/数据科学机构的 HTML 响应式模板，包含完整的文档说明和可直接使用的页面模板。模板基于 Bootstrap 3 开发，提供首页、关于页、服务、博客、案例、定价、联系方式等十余个页面，适合数字营销、数据分析、科技咨询类网站快速搭建。

技术栈link

• Bootstrap 3（CSS 框架）
• jQuery（交互脚本）
• Font Awesome（图标字体）
• Highlight.js / Prism（代码高亮）
• Google Fonts（Open Sans、Poppins 等字体）
• 静态 HTML（无需构建）

项目结构link

sabihtml-10/
└── sabi-package-files/
    ├── sabi-documentations/     # 模板使用文档
    │   ├── index.html          # 文档首页
    │   ├── css/                # 文档样式（含 bootstrap.css、style.css）
    │   ├── fonts/              # 字体文件
    │   ├── images/             # 文档图片
    │   └── js/                 # 文档脚本
    └── sabi-html-files/        # 实际模板页面
        ├── index.html          # 首页
        ├── index-2.html        # 首页变体
        ├── about.html          # 关于我们
        ├── services.html       # 服务页
        ├── blog.html           # 博客列表
        ├── blog-single.html    # 博客详情
        ├── blog-v2.html        # 博客列表 v2
        ├── cases.html          # 案例列表
        ├── cases-single.html   # 案例详情
        ├── contact.html        # 联系我们
        ├── faq.html            # 常见问题
        ├── leadership.html     # 团队领导
        ├── pricing.html        # 定价方案
        └── assets/             # 静态资源（图片、图标等）

核心文件说明link

• sabi-html-files/index.html — 网站首页入口，包含导航、轮播、服务介绍等完整模块
• sabi-documentations/index.html — 模板官方文档，说明 HTML 结构、CSS 组成、JS 功能及配置方法
• sabi-documentations/css/style.css — 文档页样式，定义了左侧边栏、配色及排版规范
• sabi-documentations/js/script.js — 文档页交互脚本，实现单页锚点导航和滚动条功能
• sabi-html-files/assets/css/sabi.css — 主模板核心样式文件（位于 html-files 下的 assets 目录）
• sabi-documentations/css/bootstrap.css — Bootstrap 框架样式，文档页依赖此库实现响应式布局

快速开始link

1. 直接在浏览器中打开 sabi-html-files/index.html 即可预览完整网站
2. 如需本地服务器（推荐），在 sabi-html-files 目录执行：
   bashcontent_copyCopy

   python -m http.server 8080
   

   然后访问 http://localhost:8080
3. 参考 sabi-documentations/index.html 了解各页面结构、组件用法及自定义配置

使用建议link

该模板适合数据科学、数字营销类企业建站，页面覆盖完整但为纯静态实现。如需动态功能（如表单提交、博客管理），建议集成后端服务或 CMS。修改模板时注意保持 Bootstrap 栅格结构不变，以免响应式布局失效。