TailwindCSS 图像边框答案

【问题标题】：TailwindCSS Image borderTailwindCSS 图像边框
【发布时间】：2022-01-08 19:47:15
【问题描述】：

我正在尝试使用border 样式设置image 元素的样式。但是由于某种原因，当我尝试向边框添加更多宽度时，浏览器不会在 image 元素上拾取它。它在其他任何事情上都可以正常工作，但是当我将更大的 width 大小添加到 border 时，我会收到错误消息。

有人可以帮忙吗？这是我下面的代码。

<img src={'https://i.ibb.co/SnDDJ99/45219372-2219308534767966-7383583342043594752-n.jpg'}
  alt='Oscar Self Portrait'
  className="
    border-4
    w-1/2
    rounded-full  
    my-4
    md:w-4/12   
    md:p-4"
/>

如果有人有解决方案，他们也可以带领我，那就太好了。

【问题讨论】：

标签： html css reactjs tailwind-css

【解决方案1】：

您的代码似乎运行良好（请参阅沙盒：https://play.tailwindcss.com/wTAwcVx1CH）。

如果您查看 Tailwind 文档，您会看到开箱即用支持的唯一宽度是 0、1、2、4 和 8（例如 border-8）。如果您需要其他宽度，您可以通过将它们添加到您的 tailwind.config.js 文件 (https://tailwindcss.com/docs/border-width#customizing-your-theme) 来自定义 Tailwind，或者，如果您使用的是 Tailwind 3.0，则可以使用新的任意值格式，例如border-[5px].

【讨论】：