Ailand - Modern Interior Design HTML Template + RTL

# 项目简介 Ailand 是一款现代室内设计与建筑行业 HTML 模板，提供首页、作品集、博客、商城（购物车/结算）、服务详情等多个完整页面，支持多首页切换与单页滚动导航。模板包含 LTR 与 RTL 两套版本，适合快速搭建建筑/室内设计公司官网或作品展示站点。 ## 技术栈 - HTML5 + CSS3（静态模板） - Bootstrap 5（响应式布局框架） - jQuery（DOM 交互与动画触发） - GSAP + ScrollTrigger（页面滚动动画与平滑滚动） - Isotope（瀑布流/马赛克布局筛选） - Magnific Popup（图片/视频弹窗） - Font Awesome 6 Pro + Google Fonts（DM Sans / Syncopate） - PHP（`mail.php` 提供联系表单邮件发送） ## 项目结构 ``` ailandhtml-10/ ├── ailand/ │ ├── index.html # 主首页 │ ├── index-2~5.html # 首页变体 │ ├── index-one-page.html # 单页版首页 │ ├── about.html, service*.html, portfolio*.html, blog*.html │ ├── shop*.html, cart.html, checkout.html, wishlist.html │ ├── contact.html, login.html, register.html, pricing.html, faq.html │ ├── error.html, team-details.html │ ├── mail.php # 联系表单后端 │ └── assets/ │ ├── css/main.css # 核心样式 │ ├── js/main.js # 全部交互逻辑（33 个功能模块） │ ├── fonts/ # Font Awesome 字体 │ └── img/ ├── ailand-rtl/ # RTL 阿拉伯语版本（结构同 ailand/） └── documentation/ # 官方文档页（参考用） ``` ## 核心文件说明 - `ailand/assets/css/main.css` — 全部样式，含 CSS 变量定义（字体、颜色、响应式断点）和 26 类组件/页面样式 - `ailand/assets/js/main.js` — 33 个 JS 模块：懒加载背景图、GSAP 滚动动画、马赛克筛选、计数动画、移动端菜单、侧边栏、灯箱等 - `ailand/mail.php` — 联系表单提交后的邮件发送脚本（需服务器 PHP 环境） - `ailand/index-one-page.html` — 单页全屏版首页，适合作品集型展示站 - `ailand/assets/js/bootstrap-bundle.js` — Bootstrap JS（含弹窗、下拉等组件） ## 快速开始 1. 直接在浏览器打开 `ailand/index.html` 预览全站 2. 或将整个 `ailand/` 目录部署到任意 Web 服务器 3. 联系表单需配置服务器端 PHP 支持；本地测试时表单提交会提示 405 ## 使用建议 模板内置 5 种首页风格与完整电商页面，建议根据实际业务选择对应入口文件替换内容；如需多语言支持，可基于已有的 `ailand-rtl/` 目录结构复制修改。全部图片路径需替换为真实资源，否则会出现 404 影响展示效果。