相关疑难解决方法(0)

我正在尝试在 tailiwnd 中使用禁用的变体，但它似乎不起作用。我不知道该怎么办。

如果它被禁用，我想更改按钮外观，我已经阅读了文档，它说默认情况下未启用“禁用”变体。所以我修改了我的 tailwind.config.js，现在它看起来像这样：

module.exports = {
  purge: [],
  theme: {
    extend: {},
  },
  variants: {
    extend: {
      opacity: ['disabled']
    }
  },
  plugins: [],
}

我的页面中有此代码，两个按钮看起来都一样：

  <div class="text-center space-x-8">
    <button type="button" class="py-2 px-4 bg-green-500 text-white font-semibold rounded-lg shadow-md hover:bg-green-700 focus:outline-none disabled:opacity-50" tabindex="-1">
      Submit
    </button>
    <button type="button" class="py-2 px-4 bg-green-500 text-white font-semibold rounded-lg shadow-md disabled:opacity-50" disabled tabindex="-1">
      Submit
    </button>
  </div>

我已经重新编译了我的代码并删除了我所有的浏览器缓存，但它仍然不起作用。我还需要做任何其他事情才能使其正常工作吗？