Question

这是我的问题，我尝试根据客户端可以选择的不同bg-*（例如：主要，警告...）来自动化按钮，链接和锚点。例如：如果我选择bg-red，我希望链接是白色的。

这里是SASS的一个示例：

@each $color, $value in $theme-colors {
  $hover-background: darken($value, 7.5%);

      .bg-#{$color} {
        color: color-contrast($value);

        a {
          color: color-contrast($value);

          &:hover,
          &:focus {
            color: color-contrast($hover-background);
          }
        }

        h1, h2, h3, h4, h5, h6 {
          color: color-contrast($value);
        }
      }
    }

根据我的不同bg-，我的颜色发生了变化。现在我的问题是，如何使用链接的“ background”属性来适应此问题？我的链接也已经在引导程序中定义了_config.scss：

// Body
//
// Settings for the `<body>` element.

$body-bg:                   $white;
$body-color:                $secondary;

// Links
//
// Style anchor elements.

$link-color:                theme-color("dark");
$link-hover-color:          darken($link-color, 15%);

对于浅色背景色，使链接颜色（带有悬停/焦点）使用默认链接颜色： -$ link-color -$ link-hover-color

然后，使先前的代码即使在黑暗的情况下也可以在主体背景下工作。

感谢您的回复。对不起，我的英语

定义了颜色对比功能以根据对比度计算颜色。塞西尔

如何根据我在Bootstrap和Sass中的链接来调整我的链接？

0 个答案: