
Piller - 房地产 HTML 模板
category房地产
# 项目简介
Piller 是一套基于 Bootstrap 的静态房地产网站模板,包含首页、关于页、房产详情、博客、电商购物车、团队、服务等 30+ 完整页面,适合快速搭建房产中介、物业或租赁平台官网。模板附带在线颜色切换器和预加载动画功能。
## 技术栈
- Bootstrap 5.x(响应式布局框架)
- jQuery(DOM 操作与交互)
- Font Awesome 6 Pro(图标)
- Magnific Popup(图片弹出)
- Swiper(轮播滑动)
- Nice Select(下拉选择)
- SCSS(CSS 预处理器)
- PHP(邮件表单处理)
## 项目结构
```
pillerhtml-10/
├── documentation/ # 模板使用文档
│ ├── index.html
│ └── assets/
│ ├── css/style.css
│ └── js/main.js
└── download-version/ # 可直接使用的完整模板
├── index.html # 首页
├── about.html
├── contact.html
├── property.html
├── property-details.html
├── blog.html
├── shop.html
├── cart.html
├── checkout.html
├── team.html
├── mail.php # 表单后端
└── assets/
├── css/style.css
└── js/main.js
```
## 核心文件说明
- `download-version/index.html` — 模板首页,含轮播图、房产分类筛选和 CTA 区块
- `download-version/assets/css/style.css` — 主样式文件,定义主题色(`--theme-color: #ff4136`)、字体和全站布局
- `download-version/assets/js/main.js` — 交互逻辑,包含移动端菜单、滚动置顶、返回顶部和表单提交
- `download-version/mail.php` — 联系人表单的后端邮件处理脚本
- `download-version/property-details.html` — 房产详情页,含 360° 全景和地图区域
- `download-version/shop.html` — 电商产品列表页,集成筛选和购物车功能
## 快速开始
1. 将 `download-version` 文件夹部署到任意 Web 服务器(Nginx / Apache / VS Code Live Server)
2. 用浏览器直接打开 `index.html` 即可预览完整模板
3. 如需联系表单功能,将模板部署到支持 PHP 的服务器并确保 `mail.php` 可执行
## 使用建议
该模板结构清晰,CSS 使用了 CSS 变量定义主题色,更换品牌色仅需修改 `:root` 中的 `--theme-color` 值。如需对接后端动态数据,可将 HTML 中的静态内容替换为模板引擎语法(如 Jinja2、EJS)或接入 CMS。
help_outline
常见问题
评论0
发布时间Jan 20, 2026
技术栈
HTML