Tailwind css translate-y-full 不起作用

Posted

技术标签:

【中文标题】Tailwind css translate-y-full 不起作用【英文标题】:Tailwind css translate-y-full does not work 【发布时间】:2021-03-25 07:17:53 【问题描述】:

这是来自编译好的 TailwindCSS 文件的原始代码:

.translate-y-full 
  --transform-translate-y: 100%; 

它不起作用。 CSS 的语法不正确。当我将其更改为:

.translate-y-full 
  transform: translateY(100%);
  /* --transform-translate-y: 100%; */

它开始起作用了。

也许我遗漏了一些东西,但它似乎是一个错误和一个大错误......???

【问题讨论】:

【参考方案1】:

transform 添加到类中。

<img class="transform translate-y-full" ...>

【讨论】:

【参考方案2】:

也许你忘了把这一行放在你的css代码中

@tailwind base;

【讨论】:

以上是关于Tailwind css translate-y-full 不起作用的主要内容,如果未能解决你的问题,请参考以下文章

Tailwind 和普通 CSS 有啥区别?

在 GrapesJS 上配置 tailwind.css

如何将@tailwind CSS 规则添加到 CSS 检查器

Vue CLI + Tailwind:使用 CSS 变量进行主题化

如何检查 Tailwind 是不是真的清除了 CSS?

不使用 Tailwind CSS 减少 css 文件