如何用Tailwind给div下任意深度的子元素a标签设置红色？

要让div下任意深度的所有a标签变为红色，你需要使用Tailwind的自定义选择器结合后代选择器，正确的class写法是：

<div class="[& a]:text-red-500">
  <p>
    <a>ham</a>
  </p>
  <div>
    <span>
      <a>another ham</a>
    </span>
  </div>
</div>

语法说明 #

• & 在Tailwind自定义选择器中代表当前元素（这里就是添加class的div）
• & a 表示当前div下所有层级的后代a标签，不管嵌套多深都会被选中
• 你之前用的 [&>p>a]:text-red-500 是直接子级选择器，只能选中div的直接子级p里的直接子级a，无法覆盖更深嵌套的情况

内容的提问来源于stack exchange，提问作者duhaime