如何在Tailwind.css中使用:not()?
我最近开始在我的Nuxt项目中尝试Teswind.css。因此我需要使用:not(:last-child)
伪元素,但我不知道如何使用。
<ul>
<li
v-for="(item, index) in items"
:key="`item-${index}`"
class="border-solid border-b border-black"
>
Item
</li>
</ul>
我要为除最后一个以外的所有<li>
添加下边框。
我知道TailWind有first&;last伪类变量,但我不能将它们与:not()
解决方案
答案在您共享的last
in the docs链接中。
只需将last:border-b-0
添加到所有列表项,如果是last-child
,则会删除border-bottom
。
<ul>
<li
v-for="(item, index) in items"
:key="`item-${index}`"
class="border-solid border-b border-black last:border-b-0"
>
Item
</li>
</ul>
相关文章