css – 在sass中获取父属性值

参见英文答案 > Sass – Manipulate inherited property?4个
我正在努力创建一个顶级< a>使用sass为我的应用程序设计样式.网站上的大部分链接都是绿色的,所以我将其作为一种风格. (我正在使用指南针来实现变暗功能)
a {
  color: green;

  &:hover {
    color: darken(green,10%);
  }
}

但是,在某些情况下,链接不是绿色.在这些情况下,我将指定文本颜色和悬停颜色,否则它将认悬停为绿色.我想知道是否有办法做这个DRYer.理想情况下,我可以获得父类颜色,就像这样.

a {
  color: green;

  &:hover {
    color: darken(parent(color),10%);
  }
}

这样,悬停将始终认为具体的颜色.这有意义吗?这样的事情可能吗?如果没有,最好的办法是什么?一个混合?

谢谢!

解决方法

我用的是mixin:
@mixin link($color) {
    a { color: $color};

    &:hover { color: darken($color,10%) };
}

.foo {
    @include link(green);
}

渲染CSS:

.foo a { color: green; }

.foo a:hover { color: #004d00; }

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效