Builda - 建筑服务和建筑 HTML 模板 preview 1

Builda - 建筑服务和建筑 HTML 模板

bookmark

Builda 是一套面向建筑施工与室内设计行业的多首页 HTML 模板,提供 10 种不同风格的首页变体(商业建设、现代建筑、工业解决方案等),内置服务介绍、项目展示、博客、定价、预约表单等完整页面,可直接作为企业官网或作品集站点使用。

HTML

项目简介

Builda 是一套面向建筑施工与室内设计行业的多首页 HTML 模板,提供 10 种不同风格的首页变体(商业建设、现代建筑、工业解决方案等),内置服务介绍、项目展示、博客、定价、预约表单等完整页面,可直接作为企业官网或作品集站点使用。

技术栈

  • HTML5 / CSS3(静态页面)
  • Bootstrap 5
  • jQuery
  • Font Awesome 6
  • Google Fonts(Outfit + Inter)

项目结构

text
buildahtml-10/
├── documentation/          # 模板使用文档
│   ├── index.html
│   ├── css/
│   └── images/
└── download-version/       # 可直接使用的完整模板
    ├── assets/
    │   ├── css/style.css
    │   └── js/main.js
    ├── index.html          # 首页(商业建设)
    ├── home-1.html ~ home-10.html
    ├── about.html
    ├── blog.html
    ├── contact.html
    ├── project.html
    ├── pricing.html
    └── mail.php             # 联系表单后端

核心文件说明

  • download-version/index.html — 主首页入口文件
  • download-version/assets/css/style.css — 全部样式定义
  • download-version/assets/js/main.js — 交互逻辑(移动端菜单、滚动、灯箱等)
  • download-version/home-*.html — 各首页变体,按需选用
  • download-version/mail.php — 联系表单邮件发送脚本
  • documentation/index.html — 官方文档,可查阅配色、Logo 替换等说明

快速开始

直接用浏览器打开 download-version/index.html,或将其部署至任意静态服务器(如 VS Code Live Server、Nginx)。

如需启用联系表单,将 mail.php 部署至支持 PHP 的服务器,并修改表单 action 路径。

使用建议

根据目标行业风格从 10 个首页中选取最接近的版本作为起点,再按 style.css 中的 CSS 变量(--theme-color 等)调整品牌配色。图片占位处需替换为实际项目素材。

help_outline

常见问题