css - SASS - 用户代理样式表覆盖链接颜色

Question

这似乎是一个非常愚蠢的问题，但我在 webkit 覆盖我的 SASS 时遇到了问题。

在我看来我有:

<%= link_to 'New Category', new_category_path, :class => 'button button-new' %>

在 application.css.scss 中:

.button{
    font-family: "Verdana", sans-serif;
    font-weight: bold;
    font-size: 15px;
    text-align: center;
    border-radius: 3px;

    a{
        color: #FFF;
        text-decoration: none;
    }
}

.button-new{
    background-color: #428bca;
    padding: 1% 2% 1% 2%;   
}

然而，我浏览器中的链接颜色是默认的带有下划线的蓝色。当我检查开发人员工具下的元素时，没有看到/读取链接的样式。相反，该链接使用用户代理样式表中的样式。

我知道我一定是犯了一些相当简单的错误，但我终究无法发现它!

Answer 1

你应该像这样定义你的 SASS:

.button{
  font-family: "Verdana", sans-serif;
  font-weight: bold;
  font-size: 15px;
  text-align: center;
  border-radius: 3px;

  color: #FFF;
  text-decoration: none;
}

因为你的链接有 .button 类。