Question

我已经将类“greenbutton”分配给了我的html中的链接，但是我在CSS上对此类所做的更改都没有生效。

home.html.erb

<p><a class="greenbutton" href="#">Sign Up</a> to learn more</p>

custom.css.scss

.greenbutton a:link, .greenbutton a:visited {
font-size: 14px;
text-decoration: none;
}

关于这一点的奇怪之处在于，当我将此类分配给前一段落标记时，更改才会生效。有什么想法吗？

Answer 1

您尝试使用的CSS应该应用于<p>或修改为a.greenbutton。您指定的是分类为greenbutton的元素中的锚点。 e.g。

.greenbutton a { } /* anchor inside .greenbutton-classed element, like:

  <p class="greenbutton">
    <a href="#">Foo</a>
  </p>

*/

a.greenbutton { } /* anchor with .greenbutton class applied, like:

  <a href="#" class="greenbutton">Bar</a>

*/

Answer 2

你的选择器错了：

.greenbutton a:link

这会将锚点链接定位到具有“greenbutton”类的元素中。你想要的是班级在锚点上：

a.greenbutton:link

Answer 3

Css类应该是这样的。

a.greenbutton, a.greenbutton:visited {
font-size: 14px;
text-decoration: none;
}

链接类不能使用CSS

3 个答案: