项目简介link

Labout 是一套基于 Bootstrap 的响应式 HTML 5 企业展示模板，适用于实验室、科研机构或服务型公司的官网建设。模板包含首页、关于、博客、服务、团队、活动、联系等多个页面，并提供 RTL/LTR 双语言模式切换和主题色切换功能。

技术栈link

• Bootstrap 5.2.0（响应式布局框架）
• jQuery（DOM 操作与交互）
• Font Awesome（图标库）
• Nice Select、Owl Carousel 等插件
• Google Fonts（Afacad、Inter 字体）
• PHP（sendemail.php 提供联系表单邮件发送）

项目结构link

labouthtml-10/Labout Pack/
├── Doc/                          # 模板文档目录
│   ├── index.html                # 文档入口页
│   ├── css/
│   │   ├── bootstrap.css
│   │   ├── font-awesome.css
│   │   ├── scrollbar.css
│   │   └── style.css
│   ├── fonts/
│   └── images/
│       ├── logo.png
│       └── mail-setting.png
│       └── map-setting.png
│   └── js/
│       ├── bootstrap.min.js
│       ├── jquery.js
│       ├── jquery.nav.js
│       ├── jquery.scrollTo.js
│       ├── respond.js
│       ├── script.js
│       └── scrollbar.js
└── Labout/                       # 模板实际文件
    ├── index.html                # 首页
    ├── about.html, blog*.html, contact.html...
    ├── sendemail.php              # 联系表单后端
    └── assets/
        ├── css/
        ├── images/
        └── js/

核心文件说明link

• Labout/index.html — 模板首页入口，包含导航、轮播、服务展示等模块
• Labout/sendemail.php — 联系表单提交后的邮件发送逻辑（需配置邮箱）
• Labout/assets/css/style.css — 主样式文件，定义全局配色与布局
• Labout/assets/css/module-css/ — 按功能模块拆分的样式（如 banner、service、team）
• Doc/index.html — 模板使用文档，说明 HTML 结构、CSS 组织、JS 功能等
• Doc/css/style.css — 文档页面自身的样式

快速开始link

1. 进入 labouthtml-10/Labout Pack/Labout/ 目录
2. 直接在浏览器打开 index.html 即可预览完整效果
3. 如需使用联系表单，将 sendemail.php 部署至 PHP 环境，并修改文件中的 RECIPIENT_EMAIL 为目标邮箱

使用建议link

• 正式项目请将 sendemail.php 部署至支持 PHP 的服务器，并注意防止垃圾邮件注入
• 模板已内置多套主题色（通过右上角切换器切换），可根据品牌需求修改 assets/css/color/theme-color.css 中的色值