HomeQuestionBlogAboutMessageToolbox
English

在Sass / Compass中自动使颜色变暗

Tony凯2020-03-24

我正在为一个网站设置CSS，该网站的所有链接处于:hover状态，比正常状态更暗。

我正在使用Sass / Compass，所以我darken在这里查看了Sass方法：http : //sass-lang.com/documentation/Sass/Script/Functions.html#darken-instance_method

这是用途： darken($color, $amount)

我的问题是：如何使此“自动”功能将所有<a>元素设置为暗80％？

我想做的是（Sass语法）：

a
   background: $blue
   &:hover
      background: darken(this element background-color, 80%)

最好的解决方案是什么？

宝儿2020/03/24 17:18:07

到目前为止，最好在本机CSS中使用过滤器：

.button:hover {
  filter: brightness(85%);
}
Tom小卤蛋2020/03/24 17:18:07

我想到了

我发现的唯一方法是创建一个mixin：

@mixin setBgColorAndHover($baseColor)
    background-color: $baseColor
    &:hover
          background-color: darken($baseColor, 5%)

接着 ：

.button
    +setBgColorAndHover($green) // as $green is a color variable I use.

不是最好的，但是那样就可以了：)

Newest Answer

HTML5 Drag & Drop 拖动时更改图标/光标
5 Answer
如何完全卸载 Node.js，然后从头重新安装 (Mac OS X)
25 Answer
MAC终端删除代理有效命令
1 Answer
vue动态路由跳转同一地址不刷新页面
0 Answer
NUXT引入tailwindcss报错Error: Expected an opening square bracket.
1 Answer

LINKS

QuestionBlogMessageToolbox