项目简介link

Arup 是一套创意多用途 HTML 网站模板，定位为商业/企业类网站解决方案。提供首页、关于页、博客、作品集、服务、联系页等多种页面模板，支持响应式布局。模板附带一份完整的文档站点，用于说明模板结构与配置方式。

技术栈link

• Bootstrap 3.x（文档）/ Bootstrap 5.x（主模板）
• jQuery + jQuery UI
• Font Awesome 图标库
• mCustomScrollbar（侧边栏滚动）
• Prism.js / jQuery Highlight（代码高亮）
• Owl Carousel、Swiper、jarallax 等第三方组件
• Google Fonts（Poppins、Open Sans、Overpass、Nunito）

项目结构link

aruphtml-10/arup-package-html/
├── arup-documentations/          # 模板官方文档站点
│   ├── index.html
│   ├── css/
│   │   ├── style.css             # 文档主样式
│   │   ├── bootstrap.css
│   │   ├── font-awesome.css
│   │   └── jquery.highlight.css
│   ├── fonts/
│   ├── images/
│   └── js/
│       ├── script.js             # 导航/滚动逻辑
│       └── ...
└── arup-html-files/              # 实际网站模板源文件
    ├── index.html                # 首页模板
    ├── about.html / contact.html / ...
    └── assets/                   # 样式/脚本/图片等资源

核心文件说明link

• arup-documentations/index.html — 文档主页入口，含模板使用说明
• arup-documentations/css/style.css — 文档站点主样式，定义侧边栏与内容区布局
• arup-documentations/js/script.js — 文档导航（onePageNav）与滚动条初始化
• arup-html-files/index.html — 主模板首页，含顶部导航、轮播、侧边挂件等完整结构
• arup-html-files/assets/css/arup.css — 主模板业务样式（含响应式规则）

快速开始link

1. 查看文档站点：在浏览器直接打开 arup-documentations/index.html，滚动阅读模板配置说明
2. 预览主模板：打开 arup-html-files/index.html 即可查看完整首页效果
3. 本地开发：推荐使用 VS Code Live Server 等工具启动本地服务器，避免部分资源跨域问题

使用建议link

主模板中所有第三方依赖（Bootstrap、jQuery 插件等）均已内置于 assets/vendors/ 目录，无需额外安装。定制样式时请修改 assets/css/ 下的对应文件而非直接覆盖 vendors 目录，以保证后续模板升级兼容。