简介
模板特点:
- 多页 演示
- 易于定制
- HTML5 和 CSS3
- 干净简单的设计
- 完全响应式布局
- W3有效
- 视网膜就绪
- 盒子图标 免费图标
- 由 Bootstrap 提供支持 (5.2.3)
- 由 jQuery 提供支持 (3.5.1)
- 流畅的动画
- 有据可查
- 跨浏览器兼容 Edge、IE10+、火狐、Opera、Chrome
开始使用
模板文件夹 埃杜勒布 可以在下载的 zip 文件中找到。需要解压 zip 文件才能找到模板和文档文件夹。
的 文件和文件夹结构 类似于以下内容:
- assets/css — 包含 CSS 文件的文件夹。
- 资源/字体 — 包含字体文件的文件夹。
- 资产/img — 包含图像文件的文件夹。
- assets/js — 包含 Javascript 文件的文件夹。
借助 FileZilla 等 FTP 客户端之一将模板文件上传到服务器。
HTML 文件:
- 首页 1 演示 (索引.html)
- 首页 2 演示 (索引2.html)
- 大约 1 页 (关于.html)
- 讲师 1 页 (讲师.html)
- 讲师单页(讲师详细信息.html)
- 404 错误页面(错误404.html)
- 课程页面(课程.html)
- 单门课程页面(单课程.html)
- 博客页面(博客.html)
- 单个博客页面(博客-single.html)
- 联系页面(联系方式.html)
文件编辑和上传:
可以通过在代码编辑器(例如 VS Code)中打开来自定义各个页面。完成所有自定义后,为了使网站上线,您需要将更新的项目文件上传到您自己域的托管服务器。可以使用 FileZilla 等 FTP 客户端上传文件。
HEAD CSS 结构
以下是 CSS 里面加载的文件 头部部分:
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/owl.carousel.min.css">
<link rel="stylesheet" href="assets/css/meanmenu.min.css">
<link rel="stylesheet" href="assets/css/magnific-popup.min.css">
<link rel="stylesheet" href="assets/css/style.css">
<link rel="stylesheet" href="assets/css/responsive.css">
JavaScript 结构
以下是 JS 结束之前加载的文件 头部或身体部分:.
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/magnific-popup.min.js"></script>
<script src="assets/js/appear.min.js"></script>
<script src="assets/js/owl.carousel.min.js"></script>
<script src="assets/js/meanmenu.min.js"></script>
<script src="assets/js/wow.min.js"></script>
<script src="assets/js/main.js"></script>
HTML结构
整个模板的一般模板结构是相同的,每个部分都位于具有部分 id 名称的部分下。这是 总体结构:
关于我们
节>
使用的字体
默认情况下,模板加载 罗博托 来自 Google 网络字体服务的字体。可以根据网站需要更改字体。 谷歌字体
字体代码可以在“样式.scss" file path: assets/css/style.scss
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap");
:root {
--fontFamily: 'Roboto', sans-serif;
}
注意: SCSS文件运行后即可工作
主要颜色变化选项
File path: assets/css/style.css
:root { --mainColor: #417972; }
注意: CSS文件运行后就可以了
如何更改图像?
请转到图像文件“路径:assets/img/...”,根据占位符图像大小和名称替换您想要的图像
如何添加现有模板的新更新
一段时间后,我们将根据最新技术更新我们的项目,但在您的模板中,如果您愿意,您需要自行更新。
制作人员
注意: 全部 图片 用于 预览 仅出于目的并且 不包括在内 在 最终购买 文件。
图片来源:
https://freepik.com/
https://pixabay.com/
https://unsplash.com/
谷歌字体:
DM Sans
图标字体:
盒子
支持
如有任何疑问,请使用 TemplateMonster 上的项目评论部分。谢谢!