如何为 scss 变量添加不透明度？

Question

我想知道是否可以将不透明度元素添加到 sass 变量中？我正在开发一个项目，我需要创建不同的颜色深浅并在自定义排版文件中使用它们。我的问题是，当我在 rdga 中创建一个颜色变量并将其实现到我的工作中时，该变量将代码更改为 CSS 不透明元素，该元素写在颜色元素下，然后它通过浏览器运行并抛出错误。是否有某种方法可以在变量中实现不透明度，这样就不会出现此问题？

任何帮助都会很棒，谢谢

这是我的变量：

   $white-text-dh: rgba(255, 255, 255, 0.5);
   $white-text-d: rgba(255, 255, 255, 0.12);

这是排版前：

  .c-title{
            font-size:20px;
            color: $white-text-d;
            font-family: Roboto-Light;
         }

这是html

         <span class="c-title">hello</span>

这是在开发人员工具中读取的内容，但颜色有错误。颜色元素无法读取不透明度

      .c-title {
                font-size: 20px;
                color: #ffffff opacity 0.7%;
                font-family: Roboto-Light;
                }

Answer 1

我对此进行了测试，它对我有用：

社会保障体系

$white: #fff;

$white-text-dh: rgba($white, .5);

.c-title {
     color: $white-text-dh;
}

超文本标记语言

<h1 class="c-title">Test</h1>