Next.js 14 个 tailwind css 类不起作用
我在新项目中将 Tailwind CSS 与 Next.js 14 一起使用,但是当我在 page.tsx 文件中使用 Tailwind CSS 类时,它不起作用。我尝试更改 tailwind.config.ts 和 tailwind.config.js acco...
构建节点项目时,我的启动脚本是: “开始”:“nodemon app.js” 和我的 tailwind 脚本来运行构建过程: "tailwind:css": "postcss ...
我对 tailwindcss 自定义颜色有疑问。我们在 tailwind.config.js 中添加了自定义颜色。 tailwind 配置文件位于根目录中。 民众 源代码 包 json postcss c...
我正在尝试使用 Tailwind CSS 创建此输入布局,但我似乎没有发现 Tailwind CSS 默认支持此功能。 我该怎么做? 预先感谢您。
tailwind 应用在 tailwind 版本 3 中不起作用
我已成功安装顺风。当涉及到使用@apply时,事情就不起作用了。 我已经成功安装顺风了。当谈到使用@apply时,事情不起作用。 <body> <!-- header --> <header class="bg-transparent absolute top-0 left-0 w-full flex items-center z-10"> <div class="container"> <div class="flex items-center justify-between relative"> <div class="px-4"> <a href="#home" class="font-bold text-lg text-primary block py-6">shrlrmdh</a> </div> <div class="flex items-center px-4"> <button id="hamburger" name="hamburger" type="button" class="block absolute right-4"> <span class="hamburger-line"></span> <span class="hamburger-line"></span> <span class="hamburger-line"></span> </button> </div> </div> </div> </header> </body> 我想仅使用 @apply 指令创建一条线并旋转跨度 这是我的 tailwind css 文件,我在其中放置了 @apply 指令 @tailwind base; @tailwind components; @tailwind utilities; .hamburger-line { @apply w-[30px] h-[2px] my-2 block bg-black; } .hamburger-active > span:nth-child(1) { @apply origin-top-left rotate-45; } .hamburger-active > span:nth-child(3) { @apply origin-bottom-left -rotate-45; } ''' I've tried many methods but @apply still doesn't work. 您需要使用 tailwind @layer 指令才能使 @apply 类正常工作。 @tailwind base; @tailwind components; @tailwind utilities; @layer components { .hamburger-line { @apply w-[30px] h-[2px] my-2 block bg-black; } .hamburger-active > span:nth-child(1) { @apply origin-top-left rotate-45; } .hamburger-active > span:nth-child(3) { @apply origin-bottom-left -rotate-45; } }
我使用 Laravel Breeze 以 Vue 为基础构建了一个新网站。现在发现 Tailwind 文档中定义的内容缺少很多类。 编辑:为了澄清这些是我尝试过的课程...
使用 Prettier 进行自动 Tailwind 类排序无法按照文档中所述工作
我在 macOS 和 VSCode 上遇到 Prettier 自动 Tailwind 类排序插件的问题。根据文档,自定义类应该排序到类的前面...
有简单的html: 公共/index.html: 有简单的html: public/index.html: <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="styles.css"> </head> <body class="text-red-600"> some text </body> css 是从 tailwindcss -i src/styles.css -o public/styles.css 获取的 src/styles.css: @tailwind base; @tailwind components; @tailwind utilities; tailwind.config.js: module.exports = { content: ["./src/**/*.{html,js}"], theme: { extend: {}, }, plugins: [], } <body>标签中的红色不适用。默认的顺风类别是否导入到public/styles.css? Tailwind 配置中的 public/index.html 文件似乎没有覆盖 content 文件。您必须确保使用 Tailwind 类的源代码文件被 content 文件 glob 覆盖,否则 Tailwind 将不会扫描这些文件,也不会为存在的类名生成 CSS 规则。考虑阅读有关配置的文档content。 module.exports = { content: [ "./src/**/*.{html,js}", "./public/index.html", ], theme: { extend: {}, }, plugins: [], }
Tailwind CSS + React - 配置棘手的响应式布局
我想使用 Tailwind 配置一个在更大屏幕上改变的布局。但是,我无法配置布局,以便在移动设备和更大的屏幕上进行调整......
好吧,这很奇怪。我已经阅读了与此相关的多个其他问题,但似乎没有任何办法可以解决它。除了断点外,Tailwind 工作正常。 我心里有这个...
React 中 Tailwind 动态类值编译的问题[重复]
我目前在尝试基于 Tailwind CSS 中动态生成的网格大小变量创建网格时遇到问题。当我使用变量设置 grid-template-rows 和 grid-template-co...
Next.js 项目中自定义类的 Tailwind CSS 编译错误
我正在使用 Tailwind CSS 开发 Next.js 项目,但遇到了似乎无法解决的编译错误。该错误与我在 theme.css 中定义的自定义实用程序类有关...
我一直在尝试在我的项目中使用 Tailwind 添加背景图片,但它不起作用,我猜是因为某个地方的资产管道冲突? 我尝试过的: 插入
通过 React 中的函数应用时未生成动态 Tailwind 类的问题
问题: 大家好,我对前端开发相当陌生,尤其是 React 和 JavaScript 框架,如 Next.js 和 Tailwind CSS。我已经开始从事几个小项目来提高我的水平
Tailwind css 类不适用于我的组件,直到我将其带到我的 page.js
tailwind 在我的 nextjs 项目上无法正常工作,我已经检查了所有配置,但没有任何检查结果。 我发现当我从导航栏组件中携带代码时它开始工作
如何让 Tailwind Intellisense 处理 .html.erb 文件?
根据我从有类似问题的人那里找到的大多数帖子,我将以下内容放入我的 VScode settings.json 中: “tailwindCSS.includeLanguages”:{ “javascript”:...
我尝试在 Angular 17 中使用 NG Block UI 并收到此错误 ng block ui error in Angular 17 知道这个模块在 Angular 17 中如何工作吗? 提前致谢 我使用 npm i ng-
我正在尝试使用 svelte 打包库创建一个 Svelte 组件包(您可以使用 npm create svelte@latest 并选择 svelte 库进行设置。然后我在
React、React Router、Joy UI:如何禁用导航离开和返回后重新出现的小吃栏?
我有一个虚拟的工作板 Web 应用程序,它使用 React 和 Joy UI 作为前端和 UI。我使用 Joy UI 的 Snackbar 组件在用户执行某些操作后临时弹出一条消息(
TailwindCss 自定义颜色无法在 javascript 中访问
我对 tailwindcss 自定义颜色有疑问。我们在 tailwind.config.js 中添加了自定义颜色。 tailwind 配置文件位于根目录中。 民众 源代码 包 json postcss c...
无法在 Material UI 日期选择器上显示错误和错误消息
我正在使用 React Material UI 我想在后端计算的某些条件下显示错误。 我使用了 Material UI-datepicker 但无法显示错误 从 'react' 导入 * as React; 导入
如何使用 UI .NET MAUI 等弹出控件获得响应式布局
我有这样的 UI 设计,其中左侧有一个弹出/停靠布局用于设置列表,然后在右侧显示所选设置的内容。 在桌面上,我希望 UI ...
在 Open Web UI 中启用 Searxng 作为 Web 搜索引擎时出错
我想在我的 Open WebUI(以前称为 Ollama Web UI)中启用 seachxng - 元搜索引擎。 我已经编写了 docker compose 文件,如下所示,但问题是,当我打开 Open Web UI 并选择 '
我正在使用 React js 来开发我的 Web 应用程序,并且我正在使用 React 材料设计来进行 UI 设计。下面是我引用的网址。 https://material-ui-next.com/ 我正在努力实现一些目标...
taiwlind JavaScript 无法在 blazor .net8 中使用 @rendermode InteractiveWebAssembly 执行
我最近配置了一个具有自动渲染模式的 Blazor 项目,并结合了 Tailwind CSS。然而,在 Razor 页面中使用需要 flowbite.min.js 的组件时,我遇到了挑战...
无法解决依赖关系:来自@material-ui/[email protected]的peer React@"^16.8.0 || ^17.0.0"
我使用创建了一个反应项目 npm 初始化 -y npm 安装 React React-dom 然后我尝试安装 Material UI npm 安装@material-ui/core 它得到错误 npm 错误!代码 ERESOLVE npm 错误!解决...
我有一个使用 Tailwind CSS 的基于 React 的 NextJS 应用程序。有一个页面组件显示从 A 到 Ö(瑞典语 aplhabet)排序的人员列表。使用移动视图时,UX 指出
我正在使用 Tailwind CSS 和内联样式在 React 中开发一个倒计时组件。我想在容器周围应用多色阴影效果,但我似乎无法让颜色显示正确...
我无法测试 Android 可组合 UI 出现“FINGERPRINT 不得为空”错误
我正在尝试写下我的可组合项的 UI 测试用例,即 包 com.lbg.project.presentation.ui.view 导入导航屏幕 导入 android.annotation.SuppressLint 导入 android.widget...
为什么Nextjs 14显示按钮与next/font和tailwind不同?
我正在尝试升级到nextjs 14,但坚持如何使用next/font。我有两个具有完全顺风类的按钮,只是最后一个的 nextjs 字体类名不同 这是我的代码 我...
Shopify结帐UI如何检索所选shippingOption的DeliveryMethodDefinition id
我正在 Shopify 的结帐扩展 UI 上开发一个应用程序,我想使用目标“purchase.checkout.shipping-option-item.render-after”在 ShippingOptions 下显示一个横幅,在此 Ba...
我正在尝试重新创建一个带有顺风的水平滚动导航栏,底部没有滚动条,就像这个例子一样(减少屏幕的宽度以便能够滚动) https://getbootstrap.com/d...
我正在尝试使用 Tailwind 构建一个具有固定标题和可滚动正文的表格。请注意,只有表格的主体应该是可滚动的,而不是周围的 div。这是为了防止
我试图了解如何测试用 Jetpack Compose 编写的 Android UI。切换到 Compose 时我的假设是我能够启动应用程序并模拟用户交互,例如......
我是 Kafka 和设置 Kafka UI 的新手,尽管我在最后的 docker 和 docker-compose 上设置了先决条件。 我最后有一个 3 节点 Kafka 集群设置。 下面是 docker-compose...
@types/material-ui 和官方的@mui/types 包有什么区别?
npm 包:@types/material-ui 和 @mui/types 我知道前者受到 Definely Typed 社区的支持,但如果存在官方类型包,为什么它首先存在呢?我已经
如何使用streamlit和networkx创建UI来创建图形?
嗨,我想创建一个 UI 来管理带有streamlit和plotly的图形的创建。 我认为一种方法是创建按钮,例如“添加节点”、“删除节点”、“创建...
我遇到一个问题,我的后端将包含浮点数(例如 10.0、20.0)的 JSON 数据发送到 UI 端。但是,在 UI 中收到这些数字并将其记录到控制台后...
我正在尝试使用 React Material UI 模态,但当它聚焦时,我总是在模态周围看到黑色边框。当它失焦时我已经删除了边框,但是如果模态聚焦......
显示已创建表格的图像。 (爬虫快照) 即使爬网程序日志指出 - 已创建 2 个表,也无法在 AWS datalake/glue UI 中的数据库选项卡下查看表。 2020-09-...
我正在为我的 Web 应用程序使用 Radix UI,我想制作一个滚动区域来填充屏幕的剩余空间并允许滚动。我尝试将滚动区域的高度设置为 100% 等,但是
我正在使用 swift-snapshot-testing 库进行快照测试。对我来说,使用不同的本地化进行所有测试以在文本更改时检查所有 UI 非常重要。 例如,t...
Apache Spark Structured Streaming 中 Spark UI 上的查询和阶段卡住了
我在 EMR 集群 (6.14) 上使用 Apache Spark Structured Streaming (3.1.2)。 Spark 结构化流将数据从 Apache Kafka 流式传输到 Delta Lake 表。当我打开 Spark UI 时,我看到以下内容
我对 C# 中的 ASP.NET Core MVC 非常陌生。我在水平排列的窗口中有 2 个数据网格或数据表。我在两个网格之间排列了一些按钮。 如何创建如下所示的 UI?拜...
我的问题是 pdftron 是否使 Flutter 开发人员能够更改 ui 并添加一些按钮? 举个例子,我想以编程方式滑动pdf页面。 我找不到任何功能可以帮助...
docker-compose traefik 与 PathRegexp 的问题
我正在尝试做的事情: 我有一个 docker-compose 文件,其中包含 4 个容器 traefik、UI、API 和 DB。 我想使用 traefik 将容器 UI 和 API 重定向到端口 80,但位于不同的 url 路径上。 ...
你好,我是 flutter 新手,我想实现这个特定的 UI。从用户界面我可以看到 - 顶部有一个自定义搜索栏,我不知道它是否是应用程序栏。 它有一个 SizedBox 或一些......
我正在努力构建一个新的 Material UI 表单。我想知道是否有只读字段的首选组件。我正在比较输入和文本字段组件,但无法真正分辨出什么......
Visual Studio git UI 不显示新的远程分支
Visual studio git UI 不显示新的远程分支。我必须删除该存储库并再次克隆该存储库才能查看新分支。单击刷新图标没有帮助。有什么办法可以刷新吗...
我正在尝试制作一种米,其中有一个球图像,它是矩形图像的子图像,我希望它来回弹跳。这就是统一 UI 的全部内容。父矩形的宽度可以...