如何将最大宽度设置为百分比或静态值答案

【问题标题】：How to set max width as a percentage or static value如何将最大宽度设置为百分比或静态值
【发布时间】：2021-01-19 06:13:50
【问题描述】：

对于带有顺风的元素的宽度，您可以按百分比或固定 rem 值设置它。设置 max-width 只能设置为断点的大小。

这是为什么？

有没有办法将 max-width 设置为不是断点的百分比或固定大小？

【问题讨论】：

标签： tailwind-css

【解决方案1】：

有没有办法将最大宽度设置为百分比或固定大小不是断点吗？

你需要customize tailwind.config.js

  // tailwind.config.js
  module.exports = {
    theme: {
      maxWidth: {
+       '1/4': '25%',
+       '1/2': '300px',
+       '3/4': '75%',
      }
    }
  }

因此，您将最大宽度固定为百分比或 px。

这是为什么？

您不受设置和功能的限制，相反，Tailwind CSS 为您提供了一个在实践中证明了自己的标准。

但如果您需要对您的项目进行微调，您可以随时进行。

享受使用 Tailwind CSS 的乐趣！

【讨论】：

【解决方案2】：

德米特里的答案是正确的，但要小心：

如果你像他提到的那样做，除了配置中的值之外，maxWidth 值都不会起作用。如果您只想扩展基本的maxWidth 值（由tailwind 提供），则必须将配置放在extend 部分中，如下所示：

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      maxWidth: {
        '1/4': '25%',
        '1/2': '300px',
        '3/4': '75%',
      }
    }
  }
}

【讨论】：

很好的说明！花点时间解决这个问题。