1

HTMLのリンクにクラス「greenbutton」を割り当てましたが、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;
}

これの奇妙な点は、このクラスを前の段落タグに割り当てると、変更が有効になることです。何かご意見は？

4

3 に答える 3

5

試している CSS は、 に適用する<p>か、 に変更する必要がありa.greenbuttonます。指定しているのは、要素 classed 内のアンカーですgreenbutton。例えば

.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>

*/
于 2012-04-25T19:57:55.090 に答える
2

セレクターが間違っています:

.greenbutton a:link

これは、「greenbutton」クラスを持つ要素内のアンカー リンクをターゲットにします。あなたが望むのは、クラスがアンカー上にあることです：

a.greenbutton:link
于 2012-04-25T19:58:09.037 に答える
1

Css クラスは次のようになります。

a.greenbutton, a.greenbutton:visited {
font-size: 14px;
text-decoration: none;
}
于 2012-04-25T20:01:04.020 に答える