css - Rails 3およびFoundation 4でa:visitedをオーバーライドする適切な方法は何ですか?

Question

Foundation 4 を使用して新しい Rails プロジェクトに取り組んでいます。Foundation のクラスを使用して、リンクをボタンに変えました。

<%= link_to 'New Item', new_item_path, :class => "small button round" %>

意図したとおりのボタンが表示されました。

ここに画像の説明を入力

ただし、リンクにアクセスすると、次のように表示されました。

ここに画像の説明を入力

それほど素晴らしいことではありません。

CSS を調べたところ、訪問したリンクの色が scaffolds.css.scss に設定されていることがわかりました。

a {
  color: #000;
  &:visited {
    color: #666;
  }
  &:hover {
    color: #fff;
    background-color: #000;
  }
}

リンクでこの色の変更を適切にキャンセルするにはどうすればよいですか? セクションを削除できることはわかっています&:visitedが、それは強引すぎるようです。もっとエレガントな方法が必要だと思いますが、CSS/SCSS/Foundation の知識が薄すぎます。

score 7 · Accepted Answer

コマンドによって生成されたばかりの場合は、scaffold.css.scss を削除しますrails g scaffold。zurb-foundation を使用する場合はおそらく冗長であり、他のいくつかのものを壊す可能性があります。

score 4 · Accepted Answer

訪問済みの疑似セレクターは、ページを提供した後にユーザーのブラウザーによって追加されるため、削除する方法はありません。すべてのリンクの色の変更をオーバーライドする場合は、&:visited を削除します。ボタンのみをオーバーライドする場合は、次を追加します。

a.button {
  &:visited {
    color: #fff !important;
  }
}

これにより、ボタンクラスの訪問済みリンクの色のみが変更されます。

2 に答える 2