WebFlux - Digital Agency HTML Template

# 项目简介 WebFlux 是一套基于 Bootstrap 的多页面商业网站模板，提供首页三套变体（index / index2 / index3），内置关于我们、博客、商店、产品详情、团队、案例、定价等完整页面，适合快速搭建企业官网或电商展示站点。 ## 技术栈 - Bootstrap 5（CSS 框架） - Owl Carousel 2（轮播组件） - jQuery UI Slider（价格区间滑块） - Font Awesome 6（图标库） - PHP（联系表单后端处理） ## 项目结构 ``` webfluxhtml-10/ documentation/ webflux/ index.html # 首页变体一 index2.html # 首页变体二 index3.html # 首页变体三 about.html # 关于我们 blog.html # 博客列表 shop.html # 商城 product-detail.html cart.html checkout.html contact.html # 联系页 contact-form.php # 表单后端 team.html testimonial.html pricing.html project.html services.html assets/ bootstrap/ bootstrap.min.css css/ custom.css, responsive.css owl.carousel.min.css priceslider.css images/ ``` ## 核心文件说明 - `index.html` — 主入口页面，包含 Banner、服务特色、案例展示等区块 - `contact-form.php` — 处理 contact.html 提交的数据，发送邮件至指定地址 - `assets/css/priceslider.css` — jQuery UI 价格滑块样式，用于商城筛选 - `assets/bootstrap/bootstrap.min.css` — Bootstrap 核心样式表 - `assets/css/owl.carousel.min.css` + `owl.theme.default.min.css` — 轮播组件样式 - `shop.html` — 商城列表页，含分类筛选与价格滑块 ## 快速开始 1. 直接在浏览器打开 `webflux/index.html` 预览完整效果 2. 若需使用联系表单，请将整个 `webflux` 文件夹部署至支持 PHP 的 Web 服务器 3. 修改 `contact-form.php` 中的 `$to_email` 为实际收件邮箱 ## 使用建议 - 本模板为纯静态页面，适合直接修改 HTML/CSS 内容后部署至任意静态托管服务 - 联系表单依赖 PHP `mail()` 函数，线上环境建议替换为 SendGrid / PHPMailer 等更可靠的邮件方案 - 页面中大量使用绝对定位和固定高度，移动端适配需额外关注 `responsive.css` 中的断点样式