HouseBox v2.0 - 房地产 HTML Bootstrap 5 模板 preview 1

HouseBox v2.0 - 房地产 HTML Bootstrap 5 模板

bookmark

HouseBox v2.0.0 是一套面向房地产行业的多页面 HTML 模板,包含首页变体、房源详情、博客、用户仪表板、FAQ、贷款计算器等 30+ 页面,适用于快速搭建房产租售网站。模板基于 Bootstrap 5,采用 jQuery 驱动,支持深色/浅色主题切换。

HTML

项目简介

HouseBox v2.0.0 是一套面向房地产行业的多页面 HTML 模板,包含首页变体、房源详情、博客、用户仪表板、FAQ、贷款计算器等 30+ 页面,适用于快速搭建房产租售网站。模板基于 Bootstrap 5,采用 jQuery 驱动,支持深色/浅色主题切换。

技术栈

  • HTML5 / CSS3(静态模板)
  • Bootstrap 5
  • jQuery 3.7.1
  • 插件:Owl Carousel、Swiper Slider、AOS 动画、Nice Select、Font Awesome

项目结构

text
houseboxhtml-20/HouseBox_v2.0.0_Unzip-First/
├── 1.HouseBox_HTML_template/          # 模板主体
│   ├── index.html ~ index4.html        # 四个首页变体
│   ├── property-details-*.html         # 4种房源详情页
│   ├── blog-*.html                     # 博客列表/详情
│   ├── dashboard.html                  # 用户仪表板
│   ├── loan-caculator.html             # 贷款计算器
│   ├── faq.html                        # 常见问题
│   ├── pricing.html                    # 定价页
│   └── assets/                         # CSS、JS、图片等静态资源
├── 2.HouseBox_Documentation/            # 官方文档(可忽略)
└── 3.HouseBox_Figma_Template/           # Figma 设计稿下载说明

核心文件说明

  • 1.HouseBox_HTML_template/index.html — 主首页,顶部导航 + Banner + 房源展示
  • property-details-v*.html — 房源详情页,支持地图、半图等不同布局
  • dashboard.html — 用户个人中心面板(我的房源、收藏、消息等)
  • loan-caculator.html — 贷款月供计算工具
  • faq.html — 折叠式常见问题页面
  • assets/css/main.css — 全局样式入口,整合所有插件样式

快速开始

本项目为纯静态模板,无需 npm install 或构建步骤:

  1. 进入 1.HouseBox_HTML_template/ 目录
  2. 直接用浏览器打开 index.html 即可预览
  3. 如需本地服务器,可执行:npx serve .(端口 3000)

使用建议

模板页面数量多,建议根据业务需求选择性保留页面,删除不需要的页面和对应资源以控制体积。所有动态交互(表单提交、用户登录)均为静态演示,需自行对接后端。

help_outline

常见问题