如何在TailwindCSS中准确指定600px宽度?

在 Tailwind Officail docs 中,我们可以使用许多宽度实用程序。

但是,我可以指定的最大固定宽度w-96,即width: 24rem; (384px)

我注意到一个奇怪的类叫做w-px,乍一看,我以为我可以做到w-600px,但它不起作用,它正是1px.

我目前正在将我的旧项目迁移到 Tailwind CSS,因此我需要指定许多奇怪的宽度,但 Tailwind CSS 默认不提供它们。

如果我能做到w-600px就好了,还是我错过了其他更好的方法?

回答

你能检查一下下面的代码吗?希望它对你有用。

#1 您需要在 tailwind.config.js 中添加以下代码

module.exports = {
  theme: {
     extend: {
       width: {
        '600': '600px',
       }
    }
  }
}

#2 之后,您可以w-600在您的 HTML 文件中使用,如下所示。

<div>...</div>


以上是如何在TailwindCSS中准确指定600px宽度?的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>