tailwindcss之分组选择器的使用:
对当前元素的子元素使用:
class="[&_.common-field\_\_input]:!w-[8.75rem]" //这个需要转义下划线(_)
解析:
[&_.common-field__input]:这是 Tailwind 的 “分组选择器” 语法,意味着它将样式应用于 .common-field__input 子元素。& 表示当前元素,_ 表示选择 .common-field__input 子元素,因此这一部分的意思是:当前元素内的 .common-field__input 子元素 将被作用此样式。
当前元素使用:
<div class="bg-blue-500 [&:hover]:bg-red-500">Hover me</div>
<div class="[&.active]:bg-green-500">Click me</div>
