uikit（小写k）是开源前端框架，非apple的uikit；需同时引入css、js及icons文件，依赖html属性如uk-accordion自动初始化，动态内容需调用uikit.update()。
UIKit 不是 CSS 框架，它是 Apple 为 iOS/macOS 开发的原生 UI 框架，和 Bootstrap、Tailwind 这类 Web 前端 CSS 框架完全无关。如果你在网页项目里搜 “UIKit”，大概率想找的是 UIkit（小写 k，无下划线）——一个轻量、模块化、基于 HTML/CSS/JS 的前端框架。
确认你用的是 UIkit 而不是 UIKit
拼写和大小写直接影响加载和功能：
-
UIKit（首字母大写 K）→ Apple 官方框架，仅用于 Swift/Objective-C 项目，不能在浏览器中运行 -
UIkit（全小写，k 小写）→ 开源前端框架，GitHub 仓库名是uikit/uikit，支持 CDN、NPM、自定义构建 - 常见误操作：
import UIKit（JS 中报错）、@import "UIKit"（Sass 中找不到路径）、引入UIKit.min.js（实际文件名是uikit.min.js）
最简方式：CDN 直接引入 UIkit
适合原型、文档页或轻量后台，无需构建工具。注意必须同时加载 CSS 和 JS，且 JS 在 DOM 后执行：
<!-- 放在 <head> 中 --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.16.19/dist/css/uikit.min.css"> <p><!-- 放在 <body> 底部 --> <script src="<a href="https://www.php.cn/link/e760fbed636849303e3d3556ee05c697">https://cdn.jsdelivr.net/npm/uikit@3.16.19/dist/js/uikit.min.js"></script></a>; <script src="<a href="https://www.php.cn/link/7b923ff231203112c7d9b367ff270dec">https://cdn.jsdelivr.net/npm/uikit@3.16.19/dist/js/uikit-icons.min.js"></script></a>;
-
uikit-icons.min.js必须单独引入，否则<span uk-icon="icon: heart"></span>类图标不显示 - 版本号（如
@3.16.19）建议锁定，避免因新版破坏性变更导致布局错乱 - 不要只引 CSS 或只引 JS —— UIkit 的组件（如
uk-dropdown）依赖 JS 初始化
用 data 属性快速启用组件，别写 JS 初始化
UIkit 设计哲学是“HTML 驱动”，绝大多数组件靠 uk-* 属性激活，不需要手写 JavaScript：
系统介绍：YIXUNCMS中专专版是易迅软件工作室在中秋节来临之即推出的专题模板建站系统，使用增强版后台管控系统，板板设计符合节日特点。易迅软件工作室恭祝全国人民中秋快乐。特别提示：由于网站页面的不同设计，部分后台功能未在前端进行体现。系统特点：1、采用目前流行的PHP语言编写，底层采用超轻量级框架作为系统支撑；2、页面布局使用DIV+CSS技术，遵循WEB标准，及大提高页面的浏览速度；3、使用应
立即学习“前端免费学习笔记（深入）”；
<!-- 折叠面板 -->
<div uk-accordion>
<div>
<a class="uk-accordion-title" href="#">标题</a>
<div class="uk-accordion-content">内容</div>
</div>
</div>
<p><!-- 下拉菜单 -->
<div class="uk-inline">
<button class="uk-button uk-button-default" type="button" uk-toggle="target: #dropdown">下拉</button>
<div id="dropdown" class="uk-dropdown" uk-drop="mode: click">
<ul class="uk-nav uk-dropdown-nav">
<li><a href="#">选项 1</a></li>
</ul>
</div>
</div>-
uk-accordion、uk-drop、uk-toggle等都是声明式指令，UIkit 自动扫描并绑定行为 - 属性值支持 JSON 写法：
uk-slider="finite: true; autoplay: true" - 如果页面动态插入新元素（如 AJAX 加载），需手动调用
UIkit.update()触发重初始化
自定义主题时，别直接改 uikit.css
UIkit 提供 Sass 源码和主题变量机制，硬改压缩后的 uikit.min.css 会导致升级困难、样式污染：
- 推荐方式：用官方
uikit/src/less/theme.less（v3）或uikit/src/scss/theme.scss（v4 beta）覆盖变量，例如修改主色：@global-primary-color: #2d8cf0; - 构建命令：
npx uikit build（需全局安装uikit-cli）或 Webpack +uikit-loader - 常见陷阱：自定义字体路径未同步更新
@font-face中的url()，导致图标或字体不显示
真正卡住人的地方往往不是语法，而是混淆了平台边界（比如把 iOS 的 UIKit 当 Web 框架用），或者忽略了 UIkit 的“自动初始化”机制——它不依赖 document.ready，但依赖 DOM 已存在。加了 uk-* 却没反应？先检查 JS 是否加载成功、uikit-icons 是否漏掉、控制台有没有 Uncaught ReferenceError: UIkit is not defined。
