UIkit 的网格布局怎么不生效? 设计师俊宇 提问于 2026-03-24 11:10:20 阅读 12 组件 我用 UIkit 写了个简单的两列布局,但元素还是堆在一起没分行。 明明加了 uk-grid 类,也引入了 UIkit 的 CSS 和 JS,咋回事? <div class="uk-grid"> <div class="uk-width-1-2">左边</div> <div class="uk-width-1-2">右边</div> </div> UI框架 我来解答 赞 2 收藏 分享 生成中... 手机扫码查看 复制链接 生成海报 反馈 发表解答 您需要先 登录/注册 才能发表解答 1 条解答 宇文熙苒 Lv1 UIkit 的网格布局不生效可能是因为默认情况下,uk-grid 类不会自动应用响应式样式或者需要额外的包裹容器。推荐的做法是确保你的 HTML 结构符合 UIkit 的规范,并且添加必要的类来触发网格行为。 首先,检查你的 uk-grid 容器是否有一个 uk-container 或者其他合适的父容器。其次,确保你包含了 UIkit 的 JavaScript 文件,因为某些动态行为依赖于它。 修改后的代码示例如下: 左边 右边 注意这里在 uk-grid 上添加了 uk-grid 属性,并且外面包裹了一个 uk-container。这样可以确保网格系统正常工作。如果问题依然存在,建议检查浏览器控制台是否有错误信息,或者确认所有 UIkit 文件都已正确加载。 回复 点赞 2026-03-24 11:17 加载更多 相关推荐 1 回答 22 浏览 UIkit 的响应式网格在 React 中不生效是怎么回事? 我用 UIkit 做了一个简单的响应式布局,但在 React 项目里移动端根本不按预期堆叠,还是横着排。明明加了 uk-grid 和 uk-child-width-1-2@s 这些类,本地 HTML ... Des.永莲 组件 2026-03-19 08:02:23 2 回答 16 浏览 UIkit动画在Vue中不生效是怎么回事? 我在Vue组件里用UIkit的uk-animation-slide-left类做入场动画,但根本没效果,是哪里写错了吗? 已经引入了UIkit的CSS和JS,其他组件比如Modal都能正常用,就动画不... 红静 ☘︎ 组件 2026-03-22 11:03:20 2 回答 35 浏览 UIkit 的滑动动画怎么不生效? 我在用 UIkit 做一个下拉菜单,想加个滑动展开的动画效果,但加上 uk-toggle 和 uk-animation-slide-top 后完全没反应,元素直接显示/隐藏了,动画一点没出来。 我查了... 夏侯绍博 组件 2026-03-17 14:56:21 1 回答 20 浏览 UIkit组件样式不生效是怎么回事? 我在Vue项目里引入了UIkit,但写出来的按钮完全没有UIkit的样式,控制台也没报错,是不是哪里配置漏了? 我按文档在main.js里import了CSS,组件里也加了uk-button类名,但按... 轩辕培珍 组件 2026-03-12 22:05:21 1 回答 17 浏览 UIkit Sortable 排序后怎么获取新的顺序? 我用 UIkit 的 sortable 组件做了一个拖拽排序列表,但拖完之后不知道怎么拿到最新的元素顺序。文档里没太看明白,试了 change 事件但好像没触发? 我的 HTML 结构大概是这样: &... 爱学习的姿言 组件 2026-03-12 12:17:21 2 回答 35 浏览 UIkit 组件样式不生效是怎么回事? 我用 UIkit 写了个按钮,但自定义的 class 样式完全没效果,是不是被 UIkit 的默认样式覆盖了? 我试过在 <button class="uk-button my-btn">... 皇甫月怡 组件 2026-03-03 14:09:20 2 回答 75 浏览 UIkit Sticky导航栏滚动到顶部时突然消失怎么办? 我在用UIkit的Sticky组件做固定导航栏,滚动到页面顶部时导航栏突然消失了,但往下拉又会出现,这是怎么回事? 代码结构是这样的: <nav class="uk-navbar-contain... 诗雅 组件 2026-02-14 06:09:24 1 回答 11 浏览 UIkit的Toggle切换器在Vue里为啥不生效? 我在Vue组件里用UIkit的uk-toggle做切换,点击按钮没反应,控制台也没报错,是不是哪里写错了? 我已经引入了UIkit的JS和CSS,普通HTML页面能用,但放到Vue单文件组件里就不行了... シ明明 组件 2026-03-25 17:48:23 1 回答 16 浏览 UIkit导航菜单点击后无法高亮当前项怎么办? 我在用 UIkit 做一个单页应用的侧边导航,想让点击的菜单项自动加上 active 状态,但试了几次都没成功。官方文档说会自动处理,但我动态生成的 nav 好像没这效果。 我尝试在点击时手动加 cl... Good“世英 组件 2026-03-24 12:21:20 1 回答 18 浏览 UIkit 的 Tab 切换后内容不显示怎么办? 我用 UIkit 做了个 Tab 组件,点击标签能切换 active 状态,但对应的内容区域一直空白。明明 HTML 结构是照着文档写的,也引入了 uikit.min.js,就是不显示内容。 试过把 ... 仕龙 组件 2026-03-21 18:14:23
uk-grid类不会自动应用响应式样式或者需要额外的包裹容器。推荐的做法是确保你的 HTML 结构符合 UIkit 的规范,并且添加必要的类来触发网格行为。首先,检查你的
uk-grid容器是否有一个uk-container或者其他合适的父容器。其次,确保你包含了 UIkit 的 JavaScript 文件,因为某些动态行为依赖于它。修改后的代码示例如下:
注意这里在
uk-grid上添加了uk-grid属性,并且外面包裹了一个uk-container。这样可以确保网格系统正常工作。如果问题依然存在,建议检查浏览器控制台是否有错误信息,或者确认所有 UIkit 文件都已正确加载。