【CSS】visitedの色を変えない方法

「visited」は、CSSの「:visited」ステートメントで、すでに訪れたリンクのスタイルを指定することができます。

しかし、「visited」のデフォルトの色を変えたくない場合は、「:visited」を使用しないことで対処することができます。

「:visited」を使用しない

「:visited」を使用せずに、すべてのリンクに同じスタイルを適用します。

a {
  color: blue;
}

「pointer-events」を使用し、クリックを無効にする

「pointer-events」を「none」に設定することで、クリックイベントを無効にすることができます。

a:visited {
  pointer-events: none;
}

JavaScriptでの解決

JavaScriptを使用して、すでに訪れたリンクを取得し、色を変えないようにします。

var links = document.querySelectorAll("a");

for (var i = 0; i < links.length; i++) {
    if (links[i].visited === true) {
        links[i].style.color = 'inherit';
    }
}

これらの方法を使用すれば、「visited」の色を変えず、訪れたリンクを特別扱いすることができます。ただし、ブラウザによっては、visitedの色を変更することができないこともあるため、最終的なデザインに合わせて、使用する方法を選択することが重要です。

また、「:visited」スタイルは、プライバシー上の問題があるため、セキュリティの観点からも使用には注意が必要です。

CSSだけではなく、JavaScriptを使用しても、一部のブラウザは「visited」に関する情報を取得することができないため、全ブラウザに対応するには制限があります。

その上、「:visited」を使用しなくても、CSSだけでも問題なくリンクのスタイルを設定することができます。