CSSが反映されない問題について

aタグの初期色は青ですが、それを黒にしたいです。
また、選択されたときの色を他の色に変更したいのですが、反映されません。
アドバイスをいただけたら幸いです。
ブートストラップを使っているため、divの構造は変更できません。

HTMl
1<header>
2    <div class="container_header">
3      <img src="../img/icon.png" alt="トップ画像" title="トップ画像" class="img_icon">
4      <div class="row_header">
5        <a href="#" class="list_selection col-1">概要</a>
6        <a href="#" class="list_selection col-1">準備</a>
7        <a href="#" class="list_selection col-1">安全</a>
8        <a href="#" class="list_selection col-1 col-md-2">マネープラン</a>
9      </div>
10    </div>
11</header>

CSS
1.row_header {
2  font-family: sans-serif;
3  font-weight: lighter;
4  font-size: 15px;
5  margin-top: 10px;
6  color: black;
7}
8.row_header a .list::selection {
9  color: #5f9ea0;
10}

m.ts10806

2020/03/29 06:05

そもそもcolor以外のご自身の指定は反映確認できてるのでしょうか

gyoruo

2020/03/29 06:40

ありがとうございます。ページジャンプなどの機能は確認済みです。

行動規範の内容に同意します

回答1件

ベストアンサー

aタグの初期色は青ですが、それを黒にしたいです。

aタグに直接colorを設定してください。

選択されたときの色を他の色に変更したいのですが、

選択されたときというのが、クリックしたときという意味なら、a:activeで色を設定してください。

css
1.row_header a { color: black; }
2.row_header a:active { color: #5f9ea0; } /*クリック時*/

他に状況に応じて下記のように設定できます。

css
1.row_header a:link { color: #000000; } /*未訪問*/
2.row_header a:visited { color: #000080; }/*訪問済み*/
3.row_header a:hover { color: #ff0000; }  /*マウスホバー時*/
4.row_header a:active { color: #ff8000; } /*クリック時*/