为什么 Tailwind 列表样式类型不起作用

Fay*_*kon 10 css tailwind-css

我已经使用 npm 安装了 Tailwind CSS,我正在使用"tailwindcss": "^2.2.15"版本。当我尝试在我的段落上应用列表样式类型时,它不起作用,它不显示任何带有内容的样式类型。

这是我的代码,在CODE上运行良好play.tailwindcss.com

但是,当我在本地代码编辑器中编写完全相同的代码时,它无法按预期工作。

当我在本地运行它时,完全相同的代码的屏幕截图。 在此输入图像描述

Mat*_*ias 38

您应该在预检文档中找到答案,更具体地说,请在此处找到。

作为解决方案,您可以添加自己的基本样式来覆盖tailwind.css文件中的默认行为,就像所有列表一样:

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  ul, ol {
    list-style: revert;
  }
}
Run Code Online (Sandbox Code Playgroud)

或者使用 tailwinds实用程序类来定位特定列表。

  • “默认情况下,有序列表和无序列表是无样式的” - 我简直惊呆了!感谢您指出链接,马蒂亚斯! (7认同)

小智 5

将实用程序类“list-inside”也添加到 ul 类中。

<ul class="list-disc list-inside">
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
</ul>
Run Code Online (Sandbox Code Playgroud)