Bistly - Restaurant and Cafe HTML Template

# 项目简介 Bistly 是一套静态 HTML 餐厅与咖啡馆网站模板，包含餐厅主页、咖啡馆主页和甜品店主页三种首页变体，覆盖菜品展示、购物车、博客、团队介绍等完整页面，适合快速搭建餐饮类商业网站。 ## 技术栈 - HTML5 + CSS3 + Vanilla JavaScript - Bootstrap 5.x（CSS 框架） - jQuery（文档页面交互） - FontAwesome（图标库） - Google Fonts（Marcellus + Roboto） - AOS（滚动动画）、Slick（轮播）、Magnific Popup（灯箱）、Nice Select（下拉选择） ## 项目结构 ``` bistlyhtml-10/ └── Main_File/ ├── Documentation/ │ └── index.html # 模板使用文档 └── bistly/ ├── index.html # 首页-餐厅 ├── index-2.html # 首页-咖啡馆 ├── index-3.html # 首页-甜品店 ├── about.html # 关于我们 ├── menu-grid.html # 菜单网格 ├── menu-list.html # 菜单列表 ├── menu-details.html # 菜品详情 ├── shop.html # 商店列表 ├── shop-details.html # 商品详情 ├── cart.html # 购物车 ├── checkout.html # 结账 ├── blogs.html # 博客列表 ├── blog-details.html # 博客详情 ├── chefs.html # 厨师团队 ├── gallery.html # 图库 ├── contact.html # 联系我们 ├── 404.html # 错误页面 └── assets/ ├── css/ # 样式文件 ├── fonts/ # 图标字体 └── images/ # 图片资源 ``` ## 核心文件说明 - `bistly/index.html` — 餐厅版首页入口，包含导航、幻灯片、菜品展示 - `bistly/assets/css/common-style.css` — 全局共享样式，所有页面依赖 - `bistly/assets/css/pages/home-restaurant.css` — 首页专属样式 - `bistly/assets/css/pages/innerpages.css` — 内页通用样式（About、Contact 等） - `bistly/checkout.html` — 结账流程页面，含表单布局 - `Main_File/Documentation/index.html` — 官方模板文档 ## 快速开始 直接用浏览器打开 `Main_File/bistly/index.html` 即可预览餐厅版首页；若需本地服务，可使用任意静态服务器（如 `npx serve .`）访问该目录。 ## 使用建议 - 三个首页（index / index-2 / index-3）共享结构和组件，仅样式主题不同，开发时可根据需要选择或合并 - 模板内置购物车和结算流程为纯前端静态演示，生产环境需对接后端 API - 首次部署时请将 `assets/images` 中的占位图替换为真实餐厅素材