1. ホーム
  2. html

[解決済み] CSSだけでリンクを無効化する方法

2022-03-18 08:44:55

質問

CSSでリンクを無効化する方法はありますか?

というクラスを持っています。 current-page で、このクラスのリンクを無効にして、クリックされても何も起こらないようにしたい。

どのように解決するのですか?

から この解決策 :

[aria-current="page"] {
  pointer-events: none;
  cursor: default;
  text-decoration: none;
  color: black;
}
<a href="link.html" aria-current="page">Link</a>

ブラウザの対応については https://caniuse.com/#feat=pointer-events . Internet Explorer をサポートする必要がある場合、回避策があります。 この回答 .

ご注意 の使用は pointer-events は実験的なもので、SVG 以外の要素に使用されます。この機能は CSS 3 UI ドラフト仕様の一部でしたが、多くの未解決問題のため、CSS 4 に延期されました。