本文介绍了覆盖链式选择器上的TailWind css@Apply指令的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

有什么方法可以覆盖链接选择器上的@apply指令吗？

示例：https://play.tailwindcss.com/2nmGe5yad3

HTML

  
Item 1
  
Item 2
  
Item 3
  
Item 4

css

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

@layer components {
  /* also doesnt work with "li.class-one" selector, works only with ".class-one" selector */
  .class-one.class-two {
    @apply text-black bg-gray-100;
  }
}

推荐答案

您可以将important:true设置到trawind.config中，这个page可以帮助您。请看下面的代码：

module.exports = {
  mode: 'jit',
  important: true,
  theme: {},
  variants: {},
  plugins: [],
}

这篇关于覆盖链式选择器上的TailWind css@Apply指令的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持吉威生活！

[英文标题]Override Tailwind CSS @apply directive on chained selectors

声明：本媒体部分图片、文章来源于网络，版权归原作者所有，如有侵权，请联系QQ:330946442删除。