首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >无法在尾风中添加自定义颜色

无法在尾风中添加自定义颜色
EN

Stack Overflow用户
提问于 2021-03-28 14:02:51
回答 1查看 2.9K关注 0票数 1

我试图添加一个自定义的颜色:

代码语言:javascript
运行
复制
extend: {
  colors: {
    'body-color': '#525B73'
  }
}

这就中断了编译,并出现了一个关于不存在的内置尾风类的错误:

bg-white类不存在。

也尝试了color: { bodyColor: '#525B73' },但没有结果。如果删除自定义颜色,此错误将消失。到底怎么回事?

下面是我的配置文件的简化版本:

代码语言:javascript
运行
复制
module.exports = {
  purge: [
    './components/**/*.vue',
    './layouts/**/*.vue',
    './pages/**/*.vue',
    './plugins/**/*.js'
  ],
  theme: {
    fontFamily: {
      'intro-black': ['intro-black', 'sans-serif']
    },
    container: {
      maxWidth: {
        lg: 'none'
      },
    },
    extend: {
      colors: {
        'body-color': '#525B73'
      },
      fontSize: {
        '30': '30px'
      },
      lineHeight: {
        '40': '40px'
      },
      height: {
        '60': '60px'
      },
      margin: {
        '100': '100px'
      },
      padding: {
        '40': '40px'
      },
      borderWidth: {
        '6': '6px'
      },
      zIndex: {
        '20000': '20000'
      },
      boxShadow: {
        '25': '0 0 20px rgba(0, 0, 0, 0.25)'
      },
      borderRadius: {
        '8': '8px'
      }
    }
  }
}

编辑:正如per@BoussadjraBrahim的评论一样,我更新到了Tailwin2.x,它将主要的编译问题替换为一个次要的“体颜色”类不存在“问题”。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-03-28 16:56:54

当您添加自定义颜色时,它将应用于任何可着色属性,如背景、文本、边框和渐变……因此,如果您定义了名为body-color的颜色,它将可用如下所示:

bg-body-color:用于背景颜色

text-body-color:用于文本颜色

border-body-color:用于边框颜色

诸若此类

我建议给出一个合适的名称,比如primaryblue-gray,而不是body-color

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/66842276

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档