Daevnt – 活动和会议 HTML 模板 preview 1

Daevnt – 活动和会议 HTML 模板

bookmark

Daevnt 是一款专为会议和活动设计的深色系 HTML 模板，提供创意会议、在线会议、教育会议三种首页变体，支持 GSAP 动画、Swiper 轮播、暗色模式切换等功能，适合快速搭建活动官网或作品集展示页面。

HTML

项目简介

Daevnt 是一款专为会议和活动设计的深色系 HTML 模板，提供创意会议、在线会议、教育会议三种首页变体，支持 GSAP 动画、Swiper 轮播、暗色模式切换等功能，适合快速搭建活动官网或作品集展示页面。

技术栈

  • HTML5 + CSS3 + Vanilla JavaScript
  • jQuery（DOM 操作与事件绑定）
  • GSAP（ScrollTrigger、SplitText 等插件实现交互动画）
  • Swiper（轮播组件）
  • SASS（样式预处理器，含源码）
  • Google Fonts（Bricolage Grotesque / DM Sans）

项目结构

text
daevnthtml-10/
├── Daevnt - Event & Conference HTML Template/
│   ├── index.html              # 主页入口
│   ├── about-us.html           # 关于页
│   ├── blog*.html              # 博客列表与详情页
│   ├── events*.html            # 活动列表与详情页
│   ├── speaker*.html           # 演讲者页
│   ├── services*.html          # 服务页
│   ├── pricing.html            # 定价页
│   ├── faq.html                # FAQ 页
│   ├── contact-us.html         # 联系页
│   ├── 404.html                # 错误页
│   ├── coming-soon.html        # 即将上线页
│   └── assets/
│       ├── css/style.css       # 编译后样式
│       ├── sass/style.scss      # SASS 源码
│       ├── js/main.js          # 交互逻辑
│       ├── fonts/              # 图标字体（Flaticon）
│       └── img/                 # 图片资源
└── Daevnt - Help Documentation/
    └── index.html              # 官方帮助文档

核心文件说明

  • index.html — 模板入口，含完整导航与首页布局
  • assets/css/style.css — 编译后样式，定义深色主题与组件样式
  • assets/sass/style.scss — SASS 源码，可自定义修改变量后重新编译
  • assets/js/main.js — 包含移动端菜单、粘性头部、GSAP 动画、计数器等逻辑
  • online-conference.html — 在线会议首页变体
  • educational-conference.html — 教育会议首页变体

快速开始

  1. 直接在浏览器中打开 Daevnt - Event & Conference HTML Template/index.html 即可预览；
  2. 如需修改样式，建议通过 style.scss 调整变量后重新编译；
  3. 替换 assets/img/ 下的占位图与 index.html 中的文案即可快速上线。

使用建议

GSAP 动画依赖 CDN 加载，首次部署请确保网络可达；深色主题适合活动氛围，但需注意浅色文字与背景的对比度以保障可访问性。

help_outline

常见问题