div classを使ったcssでテキストの色指定がうまくできません

下記のhtmlで、「サンプルサイト」という文字を赤に、「おすすめ」という文字を緑にしたいのですが、cssで設定してもうまく表示できません。

<div class="test"><a href="https://www.sample.com/">サンプルサイト</a>おすすめ<img src="kirakira.gif"></div>

cssは下記のようにしています。

.test {
color:#green;
}

.test a{
color:#red;
}

どこが間違っているのでしょうか。

質問者からの補足コメント

• ご指摘の通りでした。すみませんでした。
  ただ、それでも「サンプルサイト」の文字が赤になりませんでした。

  No.1の回答に寄せられた補足コメントです。 補足日時：2021/03/16 19:48

No.2 ベストアンサー 回答者： dyna_1550 回答日時： 2021/03/16 20:01

No1です

a:link { color: red; }
a:visited { color: gray; }
a:hover { color: red; }
a:active { color: blue; }

この回答へのお礼

どうもありがとうございました！

お礼日時：2021/03/16 20:14

No.3 回答者： metabolian 回答日時： 2021/03/16 20:01

「要素名.クラス名」で指定。

だから、“a.test”が正しいのでは？

この回答へのお礼

どうもありがとうございました！

お礼日時：2021/03/16 20:14

No.1 回答者： dyna_1550 回答日時： 2021/03/16 19:45

#は16進数なので、Greenなら、

.test {
color:#00ff00;
}

もしくは　#　を取る

.test {
color:green;
}