项目简介link

Choicy 是一款面向数字营销机构的静态 HTML 模板，提供了首页、关于、服务、团队、案例、定价等多个完整页面，内置 Swiper 轮播、sticky 导航、搜索弹窗等交互功能，适合快速搭建营销公司官网。

技术栈link

• HTML5 / CSS3（静态页面）
• Bootstrap 5（响应式布局框架）
• jQuery（DOM 操作与交互）
• Swiper.js（轮播组件）
• scroll-it.js（锚点平滑滚动）
• sticky-kit（侧边栏固定）
• Google Fonts（Urbanist + Galada 字体）

项目结构link

choicyhtml-10/
├── choicy-html/          # 模板主目录（上线使用）
│   ├── index.html        # 首页（4 种风格变体）
│   ├── about-*.html       # 关于我们
│   ├── services-*.html    # 服务相关
│   ├── blog-*.html        # 博客
│   ├── contact.html       # 联系方式
│   ├── pricing.html       # 定价页
│   ├── faqs.html          # 常见问题
│   ├── career*.html       # 招聘相关
│   ├── team-*.html        # 团队
│   ├── projects-*.html    # 项目/案例
│   ├── testimonial.html   # 客户评价
│   └── assets/
│       ├── css/           # 样式文件
│       └── js/            # 脚本文件
└── Documentation/         # 官方文档
    └── index.html

核心文件说明link

• choicy-html/index.html — 首页入口文件，包含 banner、服务展示、案例轮播等完整区块
• choicy-html/assets/js/main.js — 轮播、Sticky Header、移动端菜单、搜索弹窗等核心交互逻辑
• choicy-html/assets/css/main.css — 全站主样式表，定义了配色、字体及所有页面组件样式
• choicy-html/assets/css/bootstrap.min.css — Bootstrap 框架样式，确保响应式布局基础
• choicy-html/home-2.html — 首页变体（Hero 轮播风格），按需替换 index.html 即可切换
• Documentation/index.html — 官方文档，包含换 logo、改图、修改联系方式等操作说明

快速开始link

1. 进入 choicy-html 目录；
2. 直接用浏览器打开 index.html 即可预览；
3. 如需本地服务，可使用任意静态服务器，例如：
   bashcontent_copyCopy

   npx serve choicy-html
   

使用建议link

• 正式使用时建议将 choicy-html 目录作为站点根目录，并按 Documentation 指引替换 logo、图片和联系方式；
• 模板提供了 4 种首页风格，通过 index.html、home-2.html、home-3.html、home-4.html 切换，选取最适合业务的版本进行定制。