如何在 Tailwind CSS 中仅向左边框赋予颜色？

Question

我正在尝试在顺风CSS中为左边框赋予蓝色

我尝试将代码编写为

border-l-8-blue

但是，这是一个错误的代码，并且永远不会起作用。

这是我的问题，有什么方法可以单独为 border-left 提供颜色吗？

而不是像

border-gray

那样为所有边框提供颜色

Answer 1

记得添加边框宽度

<div class="border-4 border-l-indigo-500"></div>

Answer 2

border-l-blue

实际上是有效的，我做错的是尝试将

border-l-blue

与

border-l-8

组合在一行中作为

border-l-blue-8

。

Answer 3

要仅将边框设置到左侧，请使用以下语法

<div class="border-4 border-blue-200 border-l-green-500">text</div>

可以参考Tailwind官方文档

Answer 4

要仅将边框设置到左侧，请在 Tailwind HTML 中使用以下代码

<div class="mx-auto w-12 h-12 sm:w-16 sm:h-16 bg-gray-400 border-l-2 border-gray-600"></div>

Answer 5

<div class="border-4 border-indigo-200 border-l-indigo-500 ..."></div>